所以..我遇到了一个奇怪的问题。首先,我知道移动设备和台式机之间存在一些区别,但是似乎没有任何区别。
我认为这与我的引导程序有关,因为如果删除引导程序,它将起作用-因此,在这种情况下,我认为它不是“ click.funktion”。

我的代码如下:

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Danish Bread Studio</title>
    <!-- Almindelig CSS -->
    <link href="stylesheet.css" rel="stylesheet">
    <!-- Bootstrap -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.js"></script>
    <!-- Javascript -->
    <script type="text/javascript">
    $(document).ready(function() {
        $(".dbs, .raavarer, .baeredygtighed, .butikker").hide();
        $("#topleft, #topright, #bottomleft, #bottomright").click(function(){
                $(".dbs, .raavarer, .baeredygtighed, .butikker").hide();
                return false;
        });
        $("#topleft").click(function(){
                $(".dbs").show();
                return false;
        });
        $("#topright").click(function(){
                $(".raavarer").show();
                return false;
        });
        $("#bottomleft").click(function(){
                $(".baeredygtighed").show();
                return false;
        });
        $("#bottomright").click(function(){
                $(".butikker").show();
                return false;
        });
    });
    </script>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<!-- Generelt -->
<nav class="hidden-xs">
    <div>
        <li><a id="topleft" class="topleft" href="#">DANISH<br>BREAD<br>STUDIO<br></a></li>
        <li><a id="topright" class="topright" href="#">RÅVARER</a></li>
        <li><a id="bottomleft" class="bottomleft" href="#">BÆRE-<br>DYGTIGHED</a></li>
        <li><a id="bottomright" class="bottomright" href="#">BUTIKKER</a></li>
    </div>
</nav>

<!-- Mobil -->
<nav class="visible-xs navbar navbar-inverse navbar-fixed-top">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand">Danish Bread Studio</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav navbar-right">
        <li><a id="topleft" href="#">DANISH BREAD STUDIO</a></li>
        <li><a id="topright" href="#">RÅVARER</a></li>
        <li><a id="bottomleft" href="#">BÆREDYGTIGHED</a></li>
        <li><a id="bottomright" href="#">BUTIKKER</a></li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>
<div id="box" class="dbs">
  Lorem putent definiebas mea ex, ne pro probo graeci. Ei eam insolens perpetua tractatos, et nam ponderum evertitur, ius omnes mnesarchum comprehensam no. Offendit postulant ex mel, cum adolescens scripserit ne, te sumo tacimates splendide est. No natum simul nemore mea, prima graeco elaboraret sed cu, mea labores antiopam te.1
</div>
<div id="box" class="raavarer">
  Lorem putent definiebas mea ex, ne pro probo graeci. Ei eam insolens perpetua tractatos, et nam ponderum evertitur, ius omnes mnesarchum comprehensam no. Offendit postulant ex mel, cum adolescens scripserit ne, te sumo tacimates splendide est. No natum simul nemore mea, prima graeco elaboraret sed cu, mea labores antiopam te.2
</div>
<div id="box" class="baeredygtighed">
  Lorem putent definiebas mea ex, ne pro probo graeci. Ei eam insolens perpetua tractatos, et nam ponderum evertitur, ius omnes mnesarchum comprehensam no. Offendit postulant ex mel, cum adolescens scripserit ne, te sumo tacimates splendide est. No natum simul nemore mea, prima graeco elaboraret sed cu, mea labores antiopam te.3
</div>
<div id="box" class="butikker">
  Lorem putent definiebas mea ex, ne pro probo graeci. Ei eam insolens perpetua tractatos, et nam ponderum evertitur, ius omnes mnesarchum comprehensam no. Offendit postulant ex mel, cum adolescens scripserit ne, te sumo tacimates splendide est. No natum simul nemore mea, prima graeco elaboraret sed cu, mea labores antiopam te.4
</div>
</body>
</html>

最佳答案

Put your script code and bottom.

Try this :-
​$(document).on('click', '#bottomright', function(event) {
   $(".butikker").show();
   return false;
});

关于javascript - Javascript不会在移动设备上触发-但在台式机上可以正常运行,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/31336478/

10-13 01:44