0

我正在尝试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所以两个链接都应该是红色的，但点击时只有我点击的链接变成红色

在此处输入图像描述

4

3 回答 3

4

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

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

$("li").click(function(){
    $("#list").addClass("red");
});
于 2012-06-21T17:29:42.123 回答
2

没有调用 jQuery 函数onclick()。有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");
    });
});
于 2012-06-21T17:30:22.017 回答
0

是.click()，不是onclick

这是一个按预期工作的演示。我删除了<a>标签，所以链接颜色会干扰你正在做的事情。

于 2012-06-21T17:32:36.020 回答