如何修复这个jQuery范围错误

How to fix this jQuery Scope mistake?

本文关键字：范围 错误 jQuery 何修复      更新时间：2023-09-26

我无法在这段代码中弄清楚，我认为这是一个范围问题。

我有以下javascript片段

<javascript language="javascript>
    $(function() {
        $("#dialog").dialog({
            autoOpen: false
        });
        function getMessage(direction, msgId) {
            return "This is an " + direction + " message with ID: " + msgId;
        }
        function showMessage(direction, msgId) {
            $("#dialog").text(getMessage(direction, msgId));
            $("#dialog").dialog('open');
        }
    });
</script>

我想这样命名它

<div id="dialog" title="Message Info"></div>
<input type="button" id="btnCommand1" value="Command 1" onclick="javascript: showMessage('Outgoing', 1000487874')" />
<input type="button" id="btnCommand2" value="Command 2" onclick="javascript: showMessage('Incoming', 2000237851')" />

我明白，我可以通过jQuery绑定点击事件也但是因为我是动态创建这些按钮的，所以我需要像上面提到的那样调用它。问题我得到一个错误，showMessage()没有定义。我发现，一般来说，在jQuery作用域$(function(){})内定义的方法不能从这个作用域外访问!如何解决这个问题?

javascript:

这是一个标签，并不意味着"这是JavaScript代码"。你指定onclick属性包含带有元数据的JavaScript。

因为我是动态创建这些按钮的，所以我需要像上面提到的那样调用它。

这是一个错误的前提。

我发现在jQuery范围内定义的一般方法$(function(){})不能从这个范围外访问!如何解决这个问题?

将函数移出匿名函数

您不需要将所有内容都放入$()就绪处理程序中。它只是用来检查页面是否准备好。

但是，

延迟绑定很好，所以让我们让它工作起来。我们怎么解决这个问题呢?

使用live()绑定jQuery的$()函数:

$(function(){
    ....
    function showMessage(direction, msgId) {
        $("#dialog").text(getMessage(direction, msgId));
        $("#dialog").dialog('open');
    }
    $("#button1").live("click", function(){
        showMessage('Outgoing', 1000487874);
    });
});

如果参数是动态的，可以将它们作为数据属性包含:

<input type="button" id="btnCommand1" value="Command 1" data-param1="Outgoing" data-param2="1000487874" />

并像这样访问它们:

    $("#button1").live("click", function(){
        showMessage($(this).attr("data-param1"), $(this).attr("data-param2"));
    });

我也注意到你的HTML onlick属性有一个小错误，在数字的末尾有一个额外的引号:

onclick="javascript: showMessage('Outgoing', 1000487874')"
//should be:
onclick="javascript: showMessage('Outgoing', 1000487874)"
//or:
onclick="javascript: showMessage('Outgoing', '1000487874')"

因为你是从全局作用域中调用的，所以JS方法也需要在相同的作用域中。

你有两个选择。

  1. 你可以使用jquery绑定使用.live，所以不管它是否动态创建。

  2. 您可以将方法移出$(function(){})并放入全局作用域。

相关文章：