Jquery .click 防止默认 onClick答案

【问题标题】：Jquery .click prevent default onClickJquery .click 防止默认 onClick
【发布时间】：2012-07-26 22:47:44
【问题描述】：

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

<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() 不起作用。有什么想法吗？

【问题讨论】：

标签： javascript jquery html click

【解决方案1】：

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

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

如果是 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;
});

只是一个粗略的想法。

【讨论】：

这非常有效。不过返回 false 不是必需的。

【解决方案2】：

你可以这样做

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

    return false;
});

【讨论】：