Question

我希望有人可以告诉我出了什么问题我正在使用JQM来检测表单并解析命名锚点然后将页面向下移动到链接。

    <script src="jquery/jquery-1.10.2.min.js"></script

<script>
$("#target").on('submit', function( ) { 


  alert( "Handler for .submit() called." );

   $('.container a[href^=#]').bind('click vclick', function (ev) {
        location.hash = $(this).attr('href');
        return false;
    });
t
  event.preventDefault();

});
</script>

上述代码的工作原理和行为都如我所料。但是，一旦我链接了我需要的JQM .js文件然后加载页面，它就会在页面上移动命名锚点，然后立即移回到屏幕顶部。所以包括下面的图书馆似乎是个问题，但是我不能理解它是否有解决方法。

 <script src="jquery/jquery.mobile-1.4.4.min.js"></script>

有人知道在加载后将命名锚点保留在屏幕上的工作吗？并阻止它射击到顶部。

提前致谢

原始资料

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<title>test</title>

</head>
<body>
<div data-role="page" data-ajax="false">
  <div data-role="header" id="headerbanner">
  </div>
  <!-- /header -->
  <div data-role="content"> 

<form action="#id1" id="target" class="same-page-link" method="post" data-ajax="false">
<input type='submit' name='button' value='Submit Button' data-theme='a'  />
</form>

<br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br>
<br><br><br><br>
<br><br><br><br>
<br><br><br><br>
<br><br><br><br>
<br><br>
<br>Some breaks to lengthen page
<a id="id1" data-ajax="false">Here is</a>
<br>
<br>
<br>
<br>
<br>
    </p>
    <p class="maintext">&nbsp;</p>
  </div><!-- /content -->
  <div data-role="footer" id="footerbox">
  </div>
  <!-- /footer -->
    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>


<script>
   $('.container a[href^=#]').bind('click vclick', function (ev) {
        location.hash = $(this).attr('href');
        return false;
    });

  event.preventDefault();


</script>
    <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</div><!-- /page -->
</body>
</html>

Jquery移动命名锚点跳到顶部

0 个答案: