0

以下代码生成两个警报框，第一个包含undefined，第二个包含 id 属性。当我添加return false到最后时，它只显示undefined，并且不返回 id。我对这个 jquery 很陌生。这段代码背后的想法是，当您单击 时<a href="/abcd" id="abc"></a>，显示<ul class="abc"></ul>，它的显示最初设置为none。

$(".navgbr-itm").click(function(){
  target_menu = $(this).attr("id");
  alert(target_menu);
  //$("."+target_menu).toggle();
});

我使用 jquery 1.8.2 和 jquery-ui 1.9 。我正在将 jquery ui 用于与此片段无关的某事（用于图像滑块）。作为说明，我必须在点击后取消导航。

html:

<nav id="main-navgbr" class="htmlf-block">  
    <ul id="main-navgbr-itms" class="navgbr-itms">  
      <li id="main-nvgbr-itm-academc" class="navgbr-itm"><a  
        href="/akademik" class="navgbr-itm">Akademik</a></li>  
      <li id="main-nvgbr-itm-idari" class="navgbr-itm"><a  
        href="/idari" class="navgbr-itm">İdari / Personel</a></li>  
      <li id="main-nvgbr-itm-ogrn" class="navgbr-itm"><a  
        href="/ogrenci" class="navgbr-itm">Öğrenci</a></li>  
      <li id="main-nvgbr-itm-arastr" class="navgbr-itm"><a  
        href="/arastirma" class="navgbr-itm">Araştırma</a></li>  
      <li id="main-nvgbr-itm-hast" class="navgbr-itm"><a  
        href="/hastaneler" class="navgbr-itm">Hastaneler</a></li>  
      <li id="main-nvgbr-itm-ktph" class="navgbr-itm"><a  
        href="/kutuphane" class="navgbr-itm">Kütüphane</a></li>  
      <li id="main-nvgbr-itm-bshi" class="navgbr-itm"><a   
        href="/bshi" class="navgbr-itm">Basın / Halkla İlişkiler</a></li>   
      <li id="main-nvgbr-itm-blog" class="navgbr-itm"><a  
        href="/bloglar" class="navgbr-itm">Bloglar</a></li>  
    </ul>
</nav>

我用这个页面尝试了 w3c 验证器，它验证了。我基本上是为了培训目的重新创建我的大学网站。这个文件是通过lighttpd服务器运行的。

4

2 回答 2

0

试试这个：

<a href="#" class="menuitem" data-target-menu="mymenu">Click Me</a>

<ul id="mymenu" style="display:none;">
    <li>Submenu 1</li>
    <li>Submenu 2</li>
    <li>Submenu 3</li>
    <li>Submenu 4</li>
</ul>

<script>
$(function() {
    $('.menuitem').click(function() {
        $('ul#' + $(this).data('target-menu')).toggle();
    }
});
</script>

在这里，我向您介绍$.datajQuery 实用程序。它可以帮助您将数据存储在标签的特定"data-*"属性中。

您可以在 jQuery 文档中查看更多信息：

http://api.jquery.com/jQuery.data/

于 2012-10-12T18:17:18.280 回答
0

您的 HTML 中有嵌套.navgbr-item元素。这意味着单击链接将触发 thea和li元素的事件处理程序。这些a元素虽然没有 ID，但您会得到undefined.

不要将事件处理程序绑定到li元素和a元素，而是li仅将其绑定到元素：

$("li.navgbr-itm").click(function(){
  target_menu = $(this).attr("id");
  alert(target_menu);
  //$("."+target_menu).toggle();
});

HTML5data-属性也是存储数据的好方法。

于 2012-10-12T22:20:47.947 回答