Question

关于这个主题也有类似的问题，但他们的答案对我的问题没有用。

我试图使用jQuery的on("click")来触发一个只更改被点击的id类的函数。但是在加载页面时会调用该函数，然后如果单击应该触发该函数的函数则不会。

这是html：

<nav>
    <ul>
        <li id="all" class="tab-current"><a><span>All Departments</span></a></li>
    </ul>
</nav>

这里是js：

var $all = $("#all");
$all.on("click", function(){
    tabClicked("all");
});

我也试过这个：

$all.on("click", tabClicked("all"));

这就是功能：

function tabClicked(input){
    //do some stuff here
}

有什么想法吗？提前致谢！：）

Answer 1

点击处理程序逻辑中存在错误;你只需要将一个匿名函数传递给处理程序：

$all.on("click", function(){
    tabClicked("all");
});

您的原始$(function() {});相当于$(document).ready()，因此无论该元素是否被点击，它都会立即执行。

Answer 2

var $all = $("#all");

$all.on("click", function(){
    tabClicked("all");
});

尝试像这样编辑它。 $(function() {});与$(document).ready()类似，因此请function(){}代替$(function() {});。

编辑：

出于某种原因，如果script标记位于html中的元素之后，它就会触发。我尝试使用外部JS等代码 - 没有用。

尝试这样：JSFiddle

编辑2：你应该把你的处理程序放在任何你想要的$(document).ready()函数中，这就是原因。

$( document ).ready(function() {
 var $all = $("#all");
 $all.on("click", function(){
    alert("click");
 });
});

Answer 3

将$（function（）替换为function（）