如何解决这个jQuery范围错误？

我在这段代码中找不到的东西，我认为这是一个范围问题。如何解决这个jQuery范围错误？

我有以下的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（）{}）中定义的方法不能从这个范围之外访问！如何解决这个问题？

来源

2011-04-26 Wahid Shalaly

即使您动态创建按钮，也可以绑定点击事件。使用jquery.live或委托功能，你很好。 – corroded 2011-04-26 10:09:48

你不必把一切的$()准备处理程序中。这真的只是为了知道页面准备就绪所必需的东西。

后期绑定是好的，但是，让我们得到它的工作。我们将如何解决这个问题？

绑定在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')"

来源

2011-04-26 10:11:43

由于您是从全局范围调用，所以JS方法也需要在同一个范围内。

您有两种选择。

您可以使用jQuery使用.live所以也无所谓无论是动态创建或不具有约束力。
您可以将方法移出$(function(){})并进入全局范围。

来源

2011-04-26 10:10:34 JohnP

实际方法包含需要保持在$（function（）{}）范围内的Ajax调用。同时，按钮名称是未知的，直到ASP.NET稍后生成为止。 :) – 2011-04-26 10:26:29

为什么AJAX调用需要使用'$（function）{}'。这个调用只是'document.ready'的同义词，它本身就是用来确保你不会太早触发你的JS代码。由于我们在谈论方法声明，所以这一点变得没有意义。另外，您不需要知道按钮的名称。给他们上课，让JS去做工作 – JohnP 2011-04-26 10:32:22

谢谢约翰，看来我的$（function）{}有些问题。我会检查更多的资源，并让每个人都解决了这个问题。 – 2011-04-26 10:45:28

的javascript：

这是一个label并不意味着 “这是JavaScript代码”。您使用元数据specify that onclick attributes contain JavaScript。

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

这是一个错误的前提。

我发现通常在jQuery作用域$（function（）{}）中定义的方法不能从这个范围之外访问！如何解决这个问题？

此举匿名函数外部功能

来源

2011-04-26 10:10:49 Quentin

动态创建按钮意味着我通过ASP.NET代码创建它们。上面的JavaScript代码片段被定义了一次（在头文件中）＆我需要按照ASP.NET生成的按钮的要求使用它。所以这不是一个错误的前提。直到ASP.NET生成事件按钮名称才会知道。 – 2011-04-26 10:23:33

@Waheed，你不需要知道按钮的名字。只要你有一个类或任何其他属性，你可以将该方法绑定到它。无论它是否稍后创建 – JohnP 2011-04-26 10:30:41

@JohnP这是一个很好的，谢谢。我将为它们使用一个类，并尝试使用James W.提到的.live（）。 – 2011-04-26 10:43:36

如何解决这个jQuery范围错误？

回答

相关问题