Question

我和外部JS文件

$(document).ready(function() {
    var example = function(){ alert("hello") }
});

我想从我的html中调用该函数，我该怎么做？

<img src="..." ondblclick="example()" />

n.b。我知道jquery dblclick()，但对如何正确执行上述操作感到好奇。

Answer 1

$(document).ready(function() {
    window.example = function() {
        alert("hello")
    }
});

如果可能的话，或者在外面定义它。它看起来似乎不必在文档内部进行定义。

Answer 2

最好的选择是简单地在document.ready()之外定义函数。没有理由在$(document).ready()事件中定义函数是必要的，就像在$(document).ready()函数中调用函数一样，文档是保证准备好的。

但是，您也可以在全局窗口对象上定义该函数，如下所示：

$(document).ready(function() {
    window.example = function(){ alert("hello") }
});

Answer 3

此处的其他解决方案将起作用，但在结构上，您的项目中，最佳解决方案是从HTML中删除事件处理代码并完全通过javascript（单独的HTML / JS）连接事件。由于您的项目中已经有jQuery，因此非常简单。要做到这一点，你需要做的就是在图像上加上某种识别：

<img id="example" src="..." />

然后，你可以在你的ready（）函数中连接事件代码，就像这样

$(document).ready(function() {
    $("#example").dblclick(function() {
        alert("Hello");
    });
});

这具有以下优点：

它不会创建全局变量 - 减少全局名称空间污染。
它将HTML与javascript分开，javascript将所有代码控制在一个紧凑的位置，并且通常是一件好事
使用事件侦听器比使用。ondblclick更具可扩展性 - 允许多个不同的代码部分在同一对象上使用非冲突的事件处理程序

Answer 4

如果要从HTML访问它，您的函数应该是全局的（实际上是window对象的属性）。但最佳做法是避免全局变量和函数，而不是使用命名空间：

// let's publish our namespace to window object
if (!window.myNamespace){
    // creating an empty global object
    var myNamespace = {};
}

// and add our function to it
$(document).ready(function() {
    myNamespace.example = function(){ alert("hello"); }
});

我们可以在HTML中使用它：

<img src="..." ondblclick="myNamespace.example()" />

Answer 5

@Esailija已正确回答，但如果您想保留它，则只需删除var并将其设为全局。

var example;
$(document).ready(function() {
  example = function() {
    alert("hello")
  }
});

如果你没有把var变量/ function / object变成全局变量。使用var您正在document.ready函数中设置其上下文。

Answer 6

您可以将函数声明移到DOM-ready处理程序之外：

function example(){ alert("hello") }

$(document).ready(function() {
    // code
});

但更好的解决方案是将JavaScript保留在.js文件中并避免使用内联事件处理程序。给你的元素一个id并获取它：

<img src="..." id="imgid" />

$(document).ready(function() {
    document.getElementById("imgid").ondblclick = function(){ alert("hello") }
});

$（document）.ready（）中定义的调用函数

6 个答案: