Javascript/Jquery更改类onclick？

Question

我想改变一个类onclick.我现在所拥有的:

<script>
function changeclass() {

var NAME = document.getElementById("myclass")

NAME.className="mynewclass"

} 
</script>

但是,当然,它不起作用.此外,它应该再次恢复到previuos状态onclick.

我的HTML:

<div id="showhide" class="meta-info" onclick="changeclass();">

因此,每当我按下#showhide时,myclass应该更改为mynewclass.提前感谢您的帮助!

Answer 1

用jquery你可以做某事.像这样,它只会切换类.

$('.showhide').click(function() {
    $(this).removeClass('myclass');
    $(this).addClass('showhidenew');
});

如果要在每次单击时来回切换类,可以使用toggleClass,如下所示:

$('.showhide').click(function() {
    $(this).toggleClass('myclass');
    $(this).toggleClass('showhidenew');
});

Answer 2

你getElementById正在寻找一个id为"myclass"的元素,但在你的html中,DIV的id是showhide.改成:

<script>
function changeclass() {

var NAME = document.getElementById("showhide")

NAME.className="mynewclass"

} 
</script>

除非您尝试使用id"myclass"来定位其他元素,否则您需要确保存在这样的元素.

Answer 3

对于使用 jQuery 方法的超级简洁，请尝试：

<div onclick="$(this).toggleClass('newclass')">click me</div>

或者纯JS：

<div onclick="this.classList.toggle('newclass');">click me</div>