0

我在无序列表中有多个列表项。每个列表项如下所示：

<li class="something" onclick="function(somePHPparameter)">somePHPparameter</li>

如果这很重要，该函数将通过 ajax 填充当前为空的 div。我希望它默认情况下，当页面第一次完成加载时，单击 li 将填充 div。如果再次单击相同的 li，则会清空 div。如果点击了另一个 li，只需使用不同的“somePHPparameter”更改内容。我目前的实现是这样的：

$('.continent').click(function(){
    if ($(this).hasClass('select')){
        $("#box").empty();
        $('.continent').removeClass('select');
    }
    else{
        $('.continent').removeClass('select');
        $(this).addClass('select');
    }
});

一，我的代码有什么错误的逻辑吗？有什么额外的吗？二，实际的问题是，即使类被删除，填充 div 的 onclick 仍然发生。e.preventDefault() 和 e.stopPropagation() 不起作用。有任何想法吗？

4

2 回答 2

1

event.preventDefault() 和 event.stopPropagation() 在这种情况下将无济于事，因为在触发单击时已经调用了两个不同的函数。一个函数称为内联函数，另一个函数使用 jQuery 调用。

为避免这种情况，请从 jquery click 处理程序中删除onclick属性<li>并调用该函数。

如果它是 PHP 生成的参数，请将其添加为rel属性<li>并在 jquery 处理程序中使用，如下所示：

<li class="something" rel="somePHPparameter">somePHPparameter</li>

--

$('.continent').click(function(){
if ($(this).hasClass('select')){
    $("#box").empty();
    $('.continent').removeClass('select');
}
else{
    $('.continent').removeClass('select');
    $(this).addClass('select');

    var PHPparam = $(this).attr('rel');

    functionCallUsing(PHPparam);
}

return false;
});

只是一个粗略的想法。

于 2012-07-27T00:12:57.977 回答
0

你可以简单地做

$('.continent').click(function(){
    if ($(this).hasClass('select')){
        $("#box").empty();
        $('.continent').removeClass('select');
    }
    else{
        $('.continent').removeClass('select');
        $(this).addClass('select');
    }

    return false;
});
于 2012-07-26T22:51:03.180 回答