Question

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

我有以下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绑定click事件但是因为我动态创建这些按钮我需要像上面提到的那样调用它。我得到一个错误的问题是showMessage（）没有定义。我发现，通常，jQuery范围$（function（）{}）中定义的方法无法从此范围外访问！怎么解决这个？

Answer 1

的javascript：

这是label，并不代表“这是JavaScript代码”。您specify that onclick attributes contain JavaScript使用元数据。

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

这是一个错误的前提。

我发现通常在jQuery范围内定义的方法$（function（）{}）不能从这个范围之外访问！怎么解决这个？

将功能移到匿名功能之外

Answer 2

由于您是从全局范围调用，因此JS方法也必须在同一范围内。

您有两种选择。

您可以使用.live使用jquery绑定，因此无论是否动态创建都无关紧要。
您可以将方法移出$(function(){})并进入全局范围。

Answer 3

您无需将所有内容放在$()就绪处理程序中。这真的只是为了知道页面准备就绪所必需的东西。

然而，后期绑定很好，所以让我们开始工作吧。我们如何解决这个问题？

使用$()绑定jQuery live()函数：

$(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')"

如何修复这个jQuery Scope错误？

3 个答案: