0

也许我应该更具体。我有一个 javascript 函数，从这里调用：

<input id="Text1" type="text" onkeyup="Trova('Text1');" />

该函数搜索数组，并使用 jquery 将新行绘制到表中（ID #tabdest）：

$("#tabdest").append('<tr><td class="preview" nome="' + nomi[i] + '" >' + nomi[i] + '</td></tr>');

到目前为止一切都很好。在我的 .js 文件中，我有应该执行的这个函数：

$(document).ready(function () {
    $(".preview").mousemove(function (event) {
        ...

如果我手动编写表格，则此功能可以正常工作，但如果 jQuery 编写，则无法正常工作。

我很抱歉我的英语很糟糕，希望能得到帮助无论如何谢谢

4

3 回答 3

1

使用.on()

由于元素是动态添加的，因此您不能将事件直接绑定到它们。因此您必须使用事件委托。

$("#tabdest").on('mousemove','.preview',function(event){ ...  });

句法

$( elements ).on( events, selector, data, handler );
于 2013-10-27T11:08:47.840 回答
0

尽管其他答案已正确确定您应该使用事件委托（通过使用 jQuery 的on函数），但我想解释一下您的代码当前是如何工作的。

$(document).ready(function () {
    $(".preview").mousemove(function (event) {
        ...

翻译成文字是：当文档准备好搜索所有具有“预览”类的元素并为这些元素添加鼠标移动事件的事件处理程序。jQuery 不会变魔术。

$('.preview')...

基本上是在做

document.getElementsByClassName('preview')

它没有对 DOM 进行任何类型的映射或绑定。这意味着当您使用“预览”类添加新元素时，添加事件处理程序的代码将需要再次运行才能拾取这个新元素。

使用：

$("#tabdest").on('mousemove', '.preview', function(e) { });

将事件处理程序绑定到“tabdest”元素（不会更改），当用户单击此元素的子元素（您新创建的元素之一）时，事件会在 DOM 中冒泡并运行此函数。

于 2013-10-27T11:31:04.373 回答
0

由于preview表格单元格是动态添加的，因此您需要使用事件委托来注册事件处理程序：

// New way (jQuery 1.7+) - .on(events, selector, handler)
$('#tabdest').on('mousemove', '.preview', function(event) {        
    alert('testlink'); 
    //....
});

这会将您的事件附加到表格元素中具有类preview的任何表格单元格#tabdest，从而减少必须检查整个document元素树的范围并提高效率。

于 2013-10-27T11:12:45.987 回答