jQuery没有引用

Question

我有一个链接。我需要在单击时为元素编写一个单击函数。所以我写了这样的代码。

<div class="tabCon">
  <ul>
    <li><a href="javascript:void(0);" id="Overview">Overview</a></li>
    <li><a href="javascript:void(0);" id="ProjDet">Project Details</a></li>
    <li><a href="javascript:void(0);" id="Directions">Directions</a></li>                                         
  </ul>
<div>

我写了一个js文件，其中写了很多函数。

$('.tabCon > ul > li > a').click(function() { 
   alert('Link Clicked !');
});

但是当我在 head 部分中声明此 JavaScript 文件的引用时，这将不起作用。

当我在元素下方或关闭正文标签之前声明时，这有效

为什么会这样？还有其他方法吗？

Answer 1

如果你把

jQuery代码放在head部分，请确保你在document.ready处理程序中执行jQuery代码，否则当你尝试将点击处理程序附加到某个元素时，DOM可能还没有加载并准备好作：

$(function() {
    $('.tabCon > ul > li > a').click(function() { 
       alert('Link Clicked !');
    });
});

Answer 2

因为如果你在头部添加它，这个元素还没有在 DOM 中创建，所以你不能通过 JavaScript 把它作为一个对象来访问！

$(document).ready(function () {
  $('.tabCon > ul > li > a').click(function() { 
   alert('Link Clicked !');
  });
});

试试上面！

Answer 3

当解析器在头部时，该元素在 DOM 中不存在，但是当它（javascript 解析器）到达结束正文标记时，它确实存在。这就是原因。

Answer 4

确保在 document.ready 事件中具有 jQuery 调用。

基本上，如果你在 HEAD 块中编写 jQuery，请将整个内容包装在

$(function() {
//jquery code goes here
});

Answer 5

你把这个函数 $（"..."）.click（...）;在 $（function（）{ ... } 块中，因此它在加载页面时处于活动状态。如果没有，这是正常的，这不起作用。尝试将函数放在 $（function（）{ ... } 块中，它将起作用。

垫。