无法从html onclick启动javascript函数

Question

我相信这对你来说是一个非常简单的问题,但我只是不明白.

我有一些显示一个表的PHP代码,其中我有一个div,onclik应该触发一个函数来改变点击的元素背景颜色.

这是我的HTML:

<div class='modRequiredLink' onclick='test();'>
   <div id='animated-example' class='animatedSlide'></div>
</div>

这是功能:

function test() {
    $(".modRequiredLink").click(function (event) {
        $(this).find("#animated-example").toggleClass("red");;
    });
}

现在,像这样它可以工作,但它需要两次点击才能被触发,而如果我将功能改为这样:

function test() {
        $(this).find("#animated-example").toggleClass("red");;
}

它不再起作用了......

为什么？任何建议？提前致谢

Answer 1

您的第一个代码段运行的test()函数只绑定要在click事件时调用的处理程序,但它实际上并没有调用它.

您的第二个片段无法正常工作,因为this它不是指被点击的元素(而是指向全局window).试试这个:

<div class='modRequiredLink' onclick='test(this);'>

function test(elm) {
    $(elm).find("#animated-example").toggleClass("red");
}