<div id="display">
<div align="left" class="display_box">
<a class="test" href="#">
<img style="width:25px; float:left; margin-right:6px" src="user_img/gow.jpg">
</a>
<input type="hidden" id="uid" value="3">
<b>b</b>ack <b>b</b>ack<br>
<span style="font-size:9px; color:#999999">back</span>
</div>
<div align="left" class="display_box">
<a class="test" href="#">
<img style="width:25px; float:left; margin-right:6px" src="user_img/gow.jpg">
</a>
<input type="hidden" id="uid" value="3">
<b>b</b>ack <b>b</b>ack<br>
<span style="font-size:9px; color:#999999">back</span>
</div>
</div>
我正在使用缩略图(如 facebook)中的图像制作此自动完成搜索功能,并在 ajax 调用后将其作为 html 获取。我想做的是,如果用户单击任何带有类 display_box 的div,我想在div 中获取隐藏字段的值......
我尝试了这段代码,但它没有捕获点击事件,如果我使用 #display 点击事件捕获,但那是针对整个div。
$('.display_box').click(function() {
var id =$(this).find('input[type=hidden]').val();
});
确保添加 jQuery 文件并且 $ 没有冲突。您可以在编写 js 代码之前使用此行。
$ = jQuery.noConflict();
您的代码似乎有效。看看这个小提琴 http://jsfiddle.net/3JK4c/
您是否将代码放入文档就绪函数中?
$(document).ready(function() {
.... code here ....
});
终于发现了问题,实际上是将点击事件与 displaybox 绑定,但是当程序最初运行时或直到你搜索时不存在显示框,所以我所做的是我在 ajax 调用成功时绑定点击事件,现在它正在工作......我希望它有所帮助。实际上,当用户搜索来自数据库的内容时,这些div display_box是动态制作的,这是为任何人提供帮助的完整代码
$.ajax({
type: "POST",
url: "search.php",
data: dataString,
cache: false,
success: function(html)
{
if(html !="")
{
$("#display").html(html).show();
$('.display_box').click(function(){
$('#temp').val($(this).find('input[type=hidden]').val());
$('#searchbox').val($(this).find('.name').text());
$('#display').fadeOut('slow');
});
}
}
});