Question

我正在尝试在on-click jquery事件上为我正在做的事情添加课程

我的html文件

<head>
        <style type="text/css">
            .red{ color:red; }
        </style>
         <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript" src="js.js"></script>
    </head>
<body>
    <ul id="list">
        <li><a href="">1</a></li>
        <li><a href="">2</a></li>
    </ul>
</body>

javascript文件js.js是

$(document).ready(function(){
     $("li").onclick(function(){ // if i comment this and only add the line billow the all ul>li will red
        $("#list").addClass("red");
    });
});

当我点击li时，li的颜色将变为红色，这让我感到困惑on-click我正在将.red添加到ul 1}}所以这两个链接应该是红色的，但点击时我点击的链接变为红色

enter image description here

Answer 1

你将jQuery的.click()方法与vanilla JavaScript element.onclick = functionRef;混淆了

在您的代码示例中，您需要：

$("li").click(function(){
    $("#list").addClass("red");
});

Answer 2

没有名为onclick()的jQuery函数。有on和click，但没有onclick。您的列表元素变为红色，因为链接被激活，而不是因为您的JavaScript。

使用on：

$(document).ready(function(){
     $("li").on('click', function(){
        $("#list").addClass("red");
    });
});

或click：

$(document).ready(function(){
     $("li").click(function(){
        $("#list").addClass("red");
    });
});

Answer 3

这是.click()，而不是onclick

这是demo的正常工作。我删除了<a>代码，因此链接颜色会干扰您正在执行的操作。

得到不期望的结果在jquery onclick事件中

3 个答案: