jQuery - 如何使可点击的 var 文本放置在由更多元素（var、复选框）组成的另一个 var 中答案

【问题标题】：jQuery - How to make clickable a var text placed in another var composed by more elements (var, checkbox)jQuery - 如何使可点击的 var 文本放置在由更多元素（var、复选框）组成的另一个 var 中
【发布时间】：2015-02-26 11:31:50
【问题描述】：

我已经制作了一个 var 元素 (artwork_html) 以附加到一个 div (append_div) 中：

这个元素由以下组成：一个带有值 + 类的复选框和一个包含文本的名称（来自数组并被修改替换其中某些部分的文本）。

var name;
var artwork_html = "";
name = value['artwork']['value'].replace("http://dbpedia.org/resource/", "");

artwork_html += "<div><b>" +'<input class=artworks_checkbox type=checkbox value='+ value['artwork']['value'] + '/>' + " " + name + "</b></div>";

$('#append_div').append(artwork_html);

这会创建一个复选框和一个文本（变量名称），如下所示：

 [] Primavera_(Botticelli)
 [] Nascita_di_Venere_(Botticelli)
 [] Bacco_(Caravaggio)

如何点击名字触发一个简单的事件

 alert("Name Clicked!");

提前致谢

更新

Ankit Saroch 和 Subhasom 的回复都有效。谢谢！

【问题讨论】：

所以你想获得被点击的复选框的ID？
不，我只想单击名称（而不是复选框）并触发事件...复选框在此脚本中进行其他操作。
将复选框放在标签标签中并给出不同的类，点击检查类并设置复选框已选中
我尝试为 var 名称指定一个类，但它不起作用。我是给整个组合的 var 还是只给单个 var 打标签？

标签： javascript jquery html checkbox

【解决方案1】：

您可以在label 标记中包含名称。然后在该标签上绑定一个点击事件。

所以，你的 div 字符串如下所示：

artwork_html += "<div><b>" +'<input class=artworks_checkbox type=checkbox value='+ value['artwork']['value'] + '/>' + " <label class='artworkName'>" + name + "</label></b></div>";

在 append_div 元素上将点击事件与on 绑定，如下所示：

$('#append_div').on('click', '.artworkName', function(){
   alert($(this).html());
});

【讨论】：

【解决方案2】：

只需替换旧行：

artwork_html += "<div><b>" +'<input class=artworks_checkbox type=checkbox value='+ value['artwork']['value'] + '/>' + " " + name + "</b></div>";

换行如下：

artwork_html += "<div><b>" +'<input class=artworks_checkbox type=checkbox value='+ value['artwork']['value'] + '/>' + " <span onclick='alert(this.innerHTML)'>" + name + "</span></b></div>";

这只是像以前一样创建，但是当您单击非名称时，它会触发alert(Name)

【讨论】：