Jquery 检测图像上的点击
我正在尝试动态加载图像并显示它们,如下所示Jquery 检测图像上的点击,jquery,image,onclick,Jquery,Image,Onclick,我正在尝试动态加载图像并显示它们,如下所示 var uploader = $('#<%=uploader.ClientId%>').plupload('getUploader'); uploader.bind('FileUploaded', function (up, file, res) { $('#<%=thumbs.ClientId%>').append("<div id=" + file.id
var uploader = $('#<%=uploader.ClientId%>').plupload('getUploader');
uploader.bind('FileUploaded', function (up, file, res) {
$('#<%=thumbs.ClientId%>').append("<div id=" + file.id + ">
<a href='Uploads/" + document.getElementById("<%=currentDirectory.ClientId%>").value + "/" + file.name + "'/>
<img src='Uploads/" + document.getElementById("<%=currentDirectory.ClientId%>").value + "/" + file.name + "' width='70' height='55' data-full='Uploads/" + document.getElementById("<%=currentDirectory.ClientId%>").value + "/" + file.name + "'/></div>");
});
我试过用这种方法,但它并没有给我任何警告,即使是在div上
$('.imgContain a').click(function () {
alert('You Clicked Me');
});
那么我该怎么做呢?对于锚定,为了将点击事件附加到锚定上,如:
$('.imgContain a').live("click", function (event) {
event.preventDefault();
alert('You Clicked Me');
});
您应该使用on
方法
$('.imgContain').on("click","a,img", function (e) {
e.preventDefault();
alert('You Clicked Me');
});
要确切地知道DOM是什么样子有点困难,但我想您应该使用class.imgContain
将图像添加到div中。如果要向这些图像添加单击事件,可以执行以下操作:
$('.imgContain').on("click", "img", function () {
alert('You Clicked Me');
});
因为我相信您是在动态添加图像,所以应该使用.on()
方法绑定单击事件,而不是使用.click()
注意如果出于某种原因正在使用以前版本的jQuery,可以将.on()
更改为使用.live()
。在jQuery中学习函数live。
并在代码中使用它
jQuery版本1.4.1及以上
因为在加载页面后,元素会动态地放置在html上。单击功能未绑定 根据您的标记,您在div中没有类imgContain
的a
,如上面上传的绑定事件所示。您是否正在运行$('.imgContain a')。单击(…在加载图像后?这是有意义的,因为类“.imgContain”附加到div而不是img。尝试在img标记中添加该类?使用live函数而不是单击。在动态添加元素时,单击没有绑定。这不会有帮助,因为img不在dom中。您应该看到我的Answer。@Royi-I有trie我希望你有jquery 1.7+@Royi抱歉,我的代码有一个mstake,它运行得很好:)@RoyiNamir像这样$('.imgContain')点击点击和点击点击和点击$('.imgContain')。点击(函数(事件){console.log(event.target.id)});
@MGA-我尝试了“on”和“delegate”两种方法,但都没有成功!不推荐使用live()
,现在应该按照其他答案中的建议使用on()
。
$('.imgContain').on("click","a,img", function (e) {
e.preventDefault();
alert('You Clicked Me');
});
$('.imgContain').on("click", "img", function () {
alert('You Clicked Me');
});