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

Question

重要提示！：我必须使用 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>

但是从 onclick 属性调用函数时它不起作用，例如：

<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>

知道为什么吗？

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

Answer 1

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

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

应该是

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

演示：http://jsfiddle.net/ZeLXY/

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

Answer 2

总而言之，你做错了。

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

$('#sendButton').on('click', function () {
    alert('Direct!');
    return false;
});

绝对没有理由使用onclick 属性，甚至尝试动态设置此类属性。

要取消绑定事件处理程序，请使用off：

$('#sendButton').off('click');

Answer 3

试试这个：

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

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

Answer 4

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

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

我刚刚发现了问题-> http://jsfiddle.net/VJSRy/ IE。如果你真的想使用这种错误的方法，你应该将你的函数定义为全局函数。即：

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

即跳过 submitDB 前面的 var。