点击更改Div Class

Question

我正在尝试更改Div类。 我目前正在尝试做的是：

我在div上得到了这个：

onclick"changeClass()"

这是我的职责

function changeClass(){
    $("#test123").attr("class", "classname");
}

但是，它不起作用。 现在，您应该使用Id test123和foreach循环生成许多div，所以可能是问题所在，但我不确定

Answer 1

您忘记了= ：

onclick="changeClass()"

另外，您需要指定哪个？

onclick="changeClass(this)"

然后在代码中：

function changeClass(which) {
    $(which).attr("class", "classname");
}

除了使用jQuery，您还可以通过以下简单方法来完成所有这些工作：

 $(function () { $("div").click(function () { this.className = "classname"; }); }); 

 .classname { background: #ccf; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="test1">Test 1</div> <div id="test2">Test 2</div> <div id="test3">Test 3</div> <div id="test4">Test 4</div> 

如果要多个类，最好添加和删除类。

 $(function () { $("div").click(function () { $(this).addClass("classname"); }); }); 

 .classname { background: #ccf; } .myClass { font-weight: bold; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="test1">Test 1</div> <div id="test2" class="myClass">Test 2</div> <div id="test3">Test 3</div> <div id="test4" class="myClass">Test 4</div> 

这样，它不会影响以前的类。

Answer 2

https://developer.mozilla.org/zh-CN/docs/Mozilla/Tech/XUL/Attribute/onclick

点击
类型：脚本代码
单击对象时将调用此事件处理程序。

例
<image src =“ hello.png” onclick =“ alert（'Hi'）” />

如示例所述，应将其写为onclick=foo(args)

 changeClass = function(){ document.querySelector("div").setAttribute('class', 'black'); } 

 .red { background: red; } .black { background: black; } 

 <div class="red" onclick="changeClass()"> lorem </div> <br> <button onclick="changeClass()">click me to change class</button>