Question

我喜欢将所有JQuery函数和事件接收器扩展到$（window）.load，如下所示：

$(window).load(function ()
{
   function Foo(id)
   {
      alert(String.format("Do Foo for: {0}", id));
   }
});

通常，我在这个范围内完成所有工作，但我有一个案例，我想从一个独立的JQuery小部件构建的HREF中调用Foo（27）。 HREF看起来像这样：

<a href="javascript:Foo(27)">Click me!</a>

但是，单击链接时找不到Foo（）函数。我怎么能这样做？

[编辑]

所以，我刚刚接受了以下答案，并希望分享我的最终实施。 Foo（）已被我正在使用的实际方法的名称所取代。是的，我知道String.format（）本身不存在;它是我自己的基础库的一部分。考虑到这一点，这就是我所拥有的。这是我定义所有全局命名空间的文件。该定义存在于jQuery范围之外。

// This is defined in the global namespace
if (typeof (window.App) === "undefined")
{
   window.App = {};
}

这是构建HREF的jQuery小部件中的一行。标题用于预测，HREF导航到该预测的详细信息页面：

r = String.format('<a href="javascript:App.NavDetails({1});" class="link3">{0}</a>',
   Predikt.General.EncodeHtml(options.rowData.Title), 
   options.rowData.PredictionId);

这是我的$（window）.load（） - 范围的jQuery文件中NavDetails函数的实际实现：

$(window).load(function ()
{
   App.NavDetails = function (id)
   {
      // Do something interesting with the ID here...
      alert(String.format("The ID is: {0}", id));
   };
});

Answer 1

你可以这样做

$(window).load(function (){
    window.Foo =  function(n){
      alert(n);
   }
});

http://jsfiddle.net/JQn8H/

或者这个

var Foo;

$(window).load(function (){
    Foo =  function (n){
      alert(n);
   }
});

http://jsfiddle.net/JQn8H/2/

IMO，更好的方法是为您的应用设置命名空间，这样就不会污染全局命名空间

window.App = {};

$(window).load(function (){
   App.Foo =  function (n){
      alert(n);
   }
});

然后，在你的HTML中，你会称之为：

<a href="javascript:App.Foo(27)">Click me!</a>

http://jsfiddle.net/JQn8H/3/

但是，您可能需要考虑从脚本而不是标记中调用它。

Answer 2

将Foo函数移到$(window).load()函数之外，或将Foo绑定到加载函数内的<a>元素。您无法从外部进入$(window).load()回调。

从您的评论中看起来您需要Foo留在$(window).load()匿名函数中，因为它需要访问该范围内的其他内容。您可以通过在匿名函数之外移动对Foo的引用来解决此问题。 jm-'s方法的这种变体：

$(window).load(function() {
    //...
    function Foo() {
        //...
    }
    //...
    window.Foo = Foo;
});

这会在Foo对象中引用window，因为window是默认范围，您应该可以在<a>元素中访问它。< / p>

Answer 3

您必须选择在该范围内工作并具有可访问的功能。唯一的另一种选择是强制重新加载或将其绑定到锚点击处理程序。

此外，您可能已更改原型，但除非您有，String.format不起作用。您可能只想做"Do Foo for: " + id

function Foo(id) {
  alert("Do Foo for: " + id);
}
$(window).load( ... );

或

<a class="someClass" data-id="23">Click me!</a>

...

$(window).load(function() {
  $("a.someClass").click(function() {
    alert("Do Foo for: " + $(this).data("id"));
  });
});

如何从HREF调用$（window）.load中定义的JQuery函数

3 个答案: