Jquery 未从onclick属性正确调用JavaScript函数

重要！：我必须使用onclick属性。在我的例子中，在事件侦听器/处理程序上使用Jquery不是一个选项。为什么？我的代码中还有很多其他东西依赖于属性及其在代码中的表现形式。

将警报放入

onclick

属性时，警报按预期工作，警报显示在弹出窗口中，返回false可通过按下按钮防止表单提交：

<script>
    $().ready(function() {
        $('.pretty .prettycheckbox').click(function () {

            var myType = $('.pretty .prettycheckbox').find("input[class^=car-type]:checked").val();

            if (myType == 1) {
                $('#sendButton').attr("onclick", "alert('Direct!'); return false;");
            } 

            if (myType == 2) {
                $('#sendButton').removeAttr("onclick");
            }

        });
    });
</script>

$（）.ready（函数（））{
$（'.pretty.prettycheckbox'）。单击（函数（）{
var myType=$（'.pretty.prettycheckbox'）.find（“输入[class^=car-type]：选中”）.val（）；
如果（myType==1）{
$（'sendButton'）.attr（“onclick”，“alert（'Direct！”）；return false；”；
} 
如果（myType==2）{
$（“#sendButton”）.removeAttr（“onclick”）；
}
});
});

但从onclick attribute调用函数时，它不起作用，如：

<script>
    $().ready(function() {
        $('.pretty .prettycheckbox').click(function () {

            var myType = $('.pretty .prettycheckbox').find("input[class^=car-type]:checked").val();

            if (myType == 1) {
                $('#sendButton').attr("onclick", "submitDB(); return false;");
            } 

            if (myType == 2) {
                $('#sendButton').removeAttr("onclick");
            }

        });
    });
</script>

<script>
    $().ready(function(){
        function submitDB() {
            alert('From function!');
        }
    });
</script>

$（）.ready（函数（））{
$（'.pretty.prettycheckbox'）。单击（函数（）{
var myType=$（'.pretty.prettycheckbox'）.find（“输入[class^=car-type]：选中”）.val（）；
如果（myType==1）{
$（'#sendButton'）.attr（“onclick”，“submitDB（）；return false；”）；
} 
如果（myType==2）{
$（“#sendButton”）.removeAttr（“onclick”）；
}
});
});
$（）.ready（函数（））{
函数submitDB（）{
警报（“来自函数！”）；
}
});

知道为什么吗

---

为什么这个函数被忽略了？

它的长短不一之处在于你做错了

如果要将事件处理程序绑定到元素，请使用（或适当的别名，例如）：

绝对没有理由使用

onclick

属性，甚至没有理由尝试动态设置这些属性

要解除事件处理程序的绑定，请使用：

试试这个：

if (myType == 1) {
    $('#sendButton').on("click", function() {
        alert("clicked"); //sorry forgot to edit the callback in!
    });
} 
if (myType == 2) {
    $('#sendButton').off("click");
}

---

如果必须使用onclick，请不要使用jquery。

这不是一个好做法。您应该将事件绑定到不更改属性的元素

$('#sendButton').off("click").on("click", submitDB);

我刚发现问题-> 也就是说，如果你真的想使用这种错误的方法，你应该将你的函数定义为全局函数。即：

submitDB = function() {
   alert('From function!');
}

---

例如，跳过submitDB前面的var。

您的代码不起作用，因为您有一个大范围的问题。onclick属性只能针对全局范围内的函数。在您的情况下，您的函数不在全局范围内

<script>
    $().ready(function(){
        function submitDB() {
            alert('From function!');
        }
    });
</script>

$（）.ready（函数（））{
函数submitDB（）{
警报（“来自函数！”）；
}
});

应该是

<script>
        function submitDB() {
            alert('From function!');
        }
</script>

函数submitDB（）{
警报（“来自函数！”）；
}

演示：

---

我仍然不明白为什么“school”会尝试教授如何使用jquery添加onclick属性。没有理由想用javascript向元素添加onclick属性，更不用说jQuery了。

如果要使用jQuery，请使用

on

绑定事件处理程序，不要添加事件处理程序属性。@zzzzBov我需要使用

onclick

属性。@JimmyHendrikz为什么。您需要添加onclick而不是普通的click事件的原因很可能是由于另一个需要解决的问题。@JimmyHendrikz“为什么”非常重要。父级的.outerHTML或.innerHTML的目标是返回具有该属性的元素吗？或者是将事件绑定到元素。您尝试执行的操作可能有一个解决方案，但是除了添加onclick属性之外，我们还需要知道您到底在尝试执行什么。添加上述属性的目的是什么？为什么要这样添加呢？您已经知道它的工作方式与您的工作方式不同。这并没有告诉我为什么…不需要在属性前面加上

javascript:

。谢谢，但是函数submitDB（）没有被触发；（$（）.ready（function（）{应该是$（document）.ready（function（）{不是吗？也就是说，你确定ready处理程序被调用了吗？还要检查它是否在那里工作。该死，如果我使用

$（document）.ready（function（）），表单仍然被触发，并且onclick忽略了ecen{

，但无论如何还是要谢谢你。当我无法使用onclick触发一个简单的警报函数时，这太令人沮丧了。知道为什么它不起作用吗？@JimmyHendrikz当我们逐行提取你的代码并简单地删除函数周围准备好的文档时，它就起作用了。@JimmyHendrikz，鉴于你的更新，你仍然做得不对。永远不要依赖于它

onclick

或其他类似事件属性。它们不可靠。

<script>
    $().ready(function(){
        function submitDB() {
            alert('From function!');
        }
    });
</script>

<script>
        function submitDB() {
            alert('From function!');
        }
</script>