Question

我有一些我输出的搜索结果是这种形式：

  <div id="result" title="nCgQDjiotG0"><img src="http://i.ytimg.com/vi/nCgQDjiotG0/default.jpg"></div>

每个结果都有一个。我正在尝试检测哪一个被点击然后做一些事情。每个结果都有一个唯一的标题，但ID相同。我如何使用.click（）来知道哪一个被点击了所以我可以获得它的ID并使用它？

以下是我从上面获取HTML的方法：

$.each(response.data.items, function(i,data)
{
var video_id=data.id; 
var video_title=data.title; 
var video_thumb=data.thumbnail.sqDefault; 

var search_results="<div id='result' title='"+video_id+"'><img src='"+video_thumb+"'></div>";
$("#searchresults").append($(search_results));

我试过

 $('div').click(function(){
    alert(this.id);
});

并且警报显示“searchresults”（没有引号）。

Answer 1

此外，这是利用事件委派的绝佳机会。使用此技术，您无需担心在以编程方式插入新DOM元素后重新绑定点击处理程序。您只有一个处理程序（委托）到容器元素。

$("#searchresults").delegate("div", "click", function() { console.log(this.id); });

请参阅.delegate

Answer 2

您不能在多个标签上使用相同的ID。你必须解决这个问题。您可以使用相同的类，但页面中只能有一个具有给定ID值的对象。

this.id将获取所点击项目的ID值，一旦摆脱冲突的ID，这应该可以正常工作：

$('div').click(function(){
    alert(this.id);
});

这段代码应该是这样的：

var search_results="<div id='result'" + video_id + " title='"+video_id+"'><img src='"+video_thumb+"'></div>";
$("#searchresults").append(search_results);

为每个化身添加一个唯一的id值，append只接受字符串 - 你不需要把它变成一个jQuery对象。

Answer 3

您可以使用$(this).attr("title").val()

获取标题

多个div的jQuery .click（）事件

3 个答案: