javascript - 如何使用 jquery.html 在 div 中插入 html 代码

Question

我正在构建类似 FB 搜索框建议的脚本。在哪里，我有一个输入框，用户可以在其中输入名称.. 并且，一旦用户输入名称，一些建议就会自动出现在输入框下方。所有的建议，都会出现在一个 DIV 中。我正在使用的代码是这样的......

<input name="Emp_Name" id="emplyoee_search">  
<div class="list"></div>

我在 DIV() 中插入的建议列表.. 我通过 ajax 获取它并使用 jquery.HTML() 我在 DIV() 中插入这些列表。

我在 DIV() 中插入的建议列表 HTML 代码是这样的..

<div class="listItem" align="left">Sunit K Marwah</div>
<div class="listItem" align="left">Sunit Maurya</div>

现在，发生的事情是……我成功地在 DIV() 中构建了建议列表。但是，我被卡住的地方是……当有人点击任何特定的建议列表(名称)时，需要触发一个 javascript 事件，并且名称需要出现在给定的输入框中。

对于 java 脚本事件触发，我使用的是 JQuery.HTML() & 代码是这样的..

$("div.listItem").click(function () { 
 var string = $(this).text();
 alert(string); 
//console.log(string);
});

但是，我的问题是..我可以成功显示列表，但是当我从建议列表中单击任何特定名称时，java-script 事件没有触发并且我无法捕获该名称。

我不是 java 脚本专家。所以，不知道到底哪里出了问题。需要一些帮助。

问候

Answer 1

如果您希望事件处理程序对您动态添加到 dom 的 html 有效，那么 jQuery live功能，如果你正在寻找什么。

$("div.listItem").live("click", function () {  
   var string = $(this).text(); 
   alert(string); 
   //console.log(string);
});