Question

当我点击DIV时，我正试图让jQuery做事。我给它一个ID（Ghost），当我加载页面并单击它时，没有任何反应。如果我将脚本从“#ghost”更改为“html”，则脚本可以正常工作。这里的语法有什么问题？

failure

JS：

<body>
<div class = "graveyard">
  <div id="cont">
    <div id="ghost">
      <div class="eye"></div>
      <div class="eye"></div>
      <div id="tickle"></div>
    </div>  
  </div>
</div>

Answer 1

你忘了在JSFiddle中加载jQuery。

添加此作品：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

最好在加载页面时使函数先运行。您可以通过将其包装在$(function() { .. });中来完成此操作，如下所示：

$(function() {
    $('#ghost').click(function(){
        alert("The paragraph was clicked.");
    });
});

UPDATED FIDDLE

Answer 2

将您的JS换入document.ready()

在文档准备好之前，页面无法安全操作。＆＃34; jQuery为您检测这种准备状态。代码包含在里面 $（document）.ready（）只会运行一次页面Document Object Model（DOM）已准备好执行JavaScript代码。代码包括在内在$（window）.load（function（）{...}）里面会运行整个页面（图片或iframe），而不仅仅是DOM，已准备就绪。

更新了fiddle

$(document).ready(function(){
    alert("Does this work?");

    $('#ghost').click(function(){
        alert("The paragraph was clicked.");
    });
})  ;

jQuery单击功能无法处理ID

2 个答案: