如何使我的链接打开菜单与列表项的id,我想要访问

Jquery mobile - How to make my link to open menu with list item of id that i want to visit?

本文关键字:id 我想要 访问 列表 我的 何使 链接 打开菜单      更新时间:2023-09-26

我不知道,如何完成我的代码。我有一个可折叠的菜单,从一开始隐藏当我点击链接它显示菜单与列表项目里面,其中一个列表项目是列表与我的id,我想访问后,我点击链接。

jQuery:

$(document).ready(function() {
    $('#nav').hide();
    $('.featured_footer').click(function(e){
      $('#nav').show();
      $('#nav h4 a').trigger('click');    
   });
});
HTML:

<div id="nav" data-role="collapsible" data-theme="b">
     <h4>Menu</h4>
     <div data-role="listview" data-inset="true">
          <div id="featured" data-role="collapsible">
              <h2>Featured</h2>
              <a href="http://www.example.com" target="_blank">ATS Inspect</a><br />
              <a href="http://www.example.com" target="_blank">ATS CM4D</a><br />
              <a href="http://www.example.com" target="_blank">ATS Intelligence (OEE)</a><br />
              <a href="http://www.example.com" target="_blank">ATS Quality Products</a><br />
              <a href="http://www.example.com" target="_blank">ATS Academy</a><br />
              <a href="http://www.example.com" target="_blank">ATS Lean Six</a><br />
              <a href="http://www.example.com" target="_blank">ATS MES</a><br />
          </div>
    </div>
</div>
<a class="featured_footer" href="#featured"><h2>Featured</h2></a><br /> {* This is Link that should redirect to id="featured" *}

由于a元素没有嵌套在h4中,您可能需要尝试

  $(document).ready(function() {
      $('#nav').hide();
      $('.featured_footer').click(function(e){
      $('#nav').show();
      $('#nav #featured a').trigger('click');    
  });
 });

编辑:

如果你只是想触发点击事件,使用这个滚动到菜单列表

  $(document).ready(function() {
      $('#nav').hide();
      $('.featured_footer').click(function(e){
      $('#nav').show();
      $('#nav h4 a')[0].click();  
      window.scrollTop($('#featured').scrollTop()) 
      //or  window.scrollTop($('#featured').offset().top)  
  });
 });