Question

下面是我的可折叠列表的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>

Fiddle

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

Answer 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;

Demo

锚点在可折叠列表中不起作用

1 个答案: