jQuery .Click()不起作用
我有一个外部*.js
文件,其中包含以下代码:
$(".hlavni_tema").click(function() { alert("ok"); }); alert("loaded");
和HTML页面,如下:
Základní fyzikální pojmy a jednotky ... Astrofyzika
在HEAD部分,我包括jQuery和外部文件源,如下所示:
当我打开网页时, alert()
通知"loaded"
,以便导入jQuery文件。 但是当我点击其类为“hlavni_tema”的span元素时,没有任何反应。 我也尝试过这段代码:
.on("click", function())
和
.on("click", "#tema", function())
– 一切都无济于事。
谢谢你的帮助。
在加载DOM之后,您必须分配事件处理程序。
试试这个,它应该工作。
$(document).ready(function(){ $(".hlavni_tema").click(function() { alert("ok"); }); alert("Document loaded"); }); alert("Script loaded");
将代码放在$(document).ready()
$(document).ready(function() { $(".hlavni_tema").click(function() { alert("ok"); }); };
否则,您的代码在元素添加到DOM之前运行,因此选择器不匹配任何内容。
设置事件时,Dom可能还没有准备好。 将处理程序放在文档中
$(function(){ $(".hlavni_tema").click(function() { alert("ok"); }); });
我在Firefox,谷歌浏览器和Internet Explorer中检查了相同的代码。 它在所有三种浏览器中都有效,可能是你在Jquery文件之前添加了点击事件
请检查您是否在click.ready()函数中放置了单击代码。
关于jQuery最重要的事情之一就是需要了解DOM何时完全加载以便可以执行一个jQuery脚本。 一个好的建议是编码如下:
$(document).ready(function() { // your code });
或者,您可以使用带有匿名函数的缩写forms,如下所示:
$(function() { // your code });
有关详细信息,请参见此处
注意“.ready()”适用于DOM完全加载的时间,而匿名函数是该事件的处理程序; 看到这里 。
此外,如果您没有在本地加载库,则使用正确的jQuery源代码URL很重要。 要在StackOverflow上运行代码,我必须使用
https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js
甚至’我可以在网上找到与“http”相同的url。
注意:
就绪事件发生在加载HTML文档之后,而onload事件发生在稍后,此时所有内容(例如图像)也已加载。
看到这个讨论 。
由于您可能希望检查窗口是否已完全加载,因此该脚本也包含该代码。
$( document ).ready(function() { $('.hlavni_tema').click(function() { console.log("ok"); }); console.log("document loaded"); }); $( window ).on( "load", function() { console.log( "window loaded" ); });
#tema { background:#eef; } .hlavni_tema { color:#00c; }