0

下面是我的可折叠列表的 Jquery 代码。

<script type="text/javascript">
$(function(){
    $('li')
        .css('pointer','default')
        .css('list-style-image','none');
    $('li:has(ul)')
        .click(function(event){
            if (this == event.target) {
                $(this).css('list-style-image',
                    (!$(this).children().is(':hidden')) ? 'url(plusbox.gif)' : 'url(minusbox.gif)');
                $(this).children().toggle('slow');
            }
            return false;
        })
        .css({cursor:'pointer', 'list-style-image':'url(plusbox.gif)'})
        .children().hide();
    $('li:not(:has(ul))').css({cursor:'default', 'list-style-image':'none'});
});

下面是一个列表元素的例子

<legend>Collapsable List Demo</legend>
    <ul >
      <li>INTRODUCTION
        <ul>
          <li><a href = "index.html">How To Use These Guidelines</a></li>
          <li>Revision History</li>
        </ul>
      </li>
    </ul>

小提琴

该列表完美运行,但是每当我向元素添加 href 时,它是不可点击的。但是,如果我右键单击并选择“在新选项卡中打开”它可以工作。所以我知道所有的 HTML 都是正确的。Jquery 代码限制了重定向。

4

1 回答 1

1

似乎删除return false解决了没有副作用的问题。

if (this == event.target) {
    $(this).css('list-style-image', (!$(this).children().is(':hidden')) ? 'url(plusbox.gif)' : 'url(minusbox.gif)');
    $(this).children().toggle('slow');
}
// return false;

演示

于 2014-10-02T15:31:34.577 回答