javascript – 使用jQuery触发html onclick事件

<input type="text" id="test_value" name="test_value" value="xyz" />
<input id="test_default" name="test_default" type="checkbox" onclick="with(this.form.elements['test_value']) { disabled = this.checked; if (this.checked) { value = ''; } else {if(value=='') {value=' '; value = '';}}};" />

内联onclick是由我无法控制的cms生成的。
我想执行$(“#test_default”)。click();与jQuery,但这不工作,因为它不绑定到jQuery事件管理器。

我一直在尝试变种

$("#test_default").click(function (e) {
                    $(e.target).attr("onclick").apply(checkbox, [e]);
                    return false;
                }).click();

但无济于事。请帮忙。

谢谢。

在onclick中有几十种不同的功能可能是内联的。复制它们并且并行运行它们并不是真正的选择。

答案在一个小型演示中工作,但不在现场环境中。请看http://jsfiddle.net/GtJjt/我需要复选框被程序触发。

奇怪的只有$(“#metadata_field_text_10190_default”)[0] .click();触发事件正确。任何人都可以解释这个?

直接调用本机DOM的onclick(see demo):

$("#test_default")[0].onclick();

或者,没有jQuery,

document.getElementById("test_default").onclick();

更新:

实际的问题是jQuery的.click()和内联onclick代码之间的交互。 jQuery的.click()实际上有两件事情:它首先触发任何事件处理程序,包括内联onclick代码,然后它使复选框被选中。

出现问题是因为内联代码测试是否勾选了复选框。因为这是首先触发的,代码会发现该复选框未被选中,并且不执行任何操作。现在完成之后,jQuery然后去检查复选框。

我们如何解决这个问题?我们首先手动检查复选框,然后调用内联处理程序。不幸的是,我们不能使用jQuery的.click()来调用内联处理程序,因为它会再次取消选中该复选框(如果你以后添加这些处理程序,它也会调用其他jQuery绑定的事件处理程序,你可能不想要那)。因此,我们使用我之前描述的本机DOM方法,因为它唯一的效果是运行内联代码。

最后的代码是:

$("#metadata_field_text_10190_default").attr("checked", true)[0].onclick();

请参阅演示:http://jsfiddle.net/GtJjt/3/.(我在演示的内联代码中包含一个console.log,以证明内联代码正在运行。如果浏览器不是Firefox或Chrome,或者它会崩溃,请删除此内容)。

再次更新:

Simon没有看到你的解决方案,感谢提醒我关于[0] .click()。本质上它是jQuery的.click()的本地代码,它的作用是因为它执行了上面所述(首先检查复选框,然后调用内联代码)。一个警告虽然:这也将调用与jQuery绑定的任何事件处理程序,这可能不是你想要的。

翻译自:https://stackoverflow.com/questions/4624670/using-jquery-to-trigger-html-onclick-event

转载注明原文:javascript – 使用jQuery触发html onclick事件