Question

我有一个id为

的html元素

<img id = "ShowOrHideImage" src="~/Images/show_expander.png"/>

当我将脚本放到html中时，我可以在点击后收到消息：

<script>
    $("#ShowOrHideImage").click(function () {
        alert("function invoked");
    });
</script>

但是当我把脚本放到外部文件MyScript.js：

时

alert("Script is there");

$("#ShowOrHideImage").click(function () {
    alert("function invoked");
});

我收到消息“脚本在那里”但从未“调用函数” 我不知道是什么原因。有任何想法吗？提前谢谢。

Answer 1

external javascript文件将在使用DOM document.ready的元素变为可用之前加载。还要确保在外部javascript文件之前包含jQuery文件。

$(document).ready(function(){

  $("#ShowOrHideImage").click(function () {
      alert("function invoked");
  });

});

Answer 2

试试这个：

alert("Script is there");

$(function () {
  $("#ShowOrHideImage").click(function () {
    alert("function invoked");
  });
});

$(function() {只是$(document).ready(function () {的缩写。

此外，它在您的文档中嵌入的原因是因为您将其放在<body>标记中，我推测，在所有内容的后面（或不是）。如果您将其嵌入<head>标记中，它仍然无效，并且需要$(function () {。