Question

我有这样简单的html创建：

$('#date_'+user_id).append('<input  type="text" size="20" id="date_new_'+user_id+'" value="'+dateStr+'"/>');

你可以看到id是动态的，然后我尝试将函数绑定到它中：

$('#date_new_'+user_id+"'").bind({
    click: function() {
    alert("do something on click");
     },
    mouseenter: function() {
    alert("do something on mouseenter"); 
}

}）;

再次，你可以看到即时通讯使用动态ID（我创建的那个）但它给我这样的错误：

Uncaught Error: Syntax error, unrecognized expression: #date_new_97' jquery-1.8.2.min.js:2
bc.error jquery-1.8.2.min.js:2
bh jquery-1.8.2.min.js:2
bp jquery-1.8.2.min.js:2
r.querySelectorAll.bp jquery-1.8.2.min.js:2
bc jquery-1.8.2.min.js:2
p.fn.extend.find jquery-1.8.2.min.js:2
p.fn.p.init jquery-1.8.2.min.js:2
p jquery-1.8.2.min.js:2
(anonymous function)
p.event.dispatch jquery-1.8.2.min.js:2
g.handle.h

我确实看到通过chrome developer tools和firebug创建的文本元素

Answer 1

$('#date_new_'+user_id+"'")是您的问题。

鉴于此案例：

var user_id = 15;
var jquery_selector = '#date_new_'+user_id+"'";

jquery_selector现在是#date_new_15'而不是#date_new_15。请注意尾随的单引号。

将其更改为$('#date_new_'+user_id)，它应该可以正常工作。

Answer 2

试试这段代码：

$('#date_new_'+user_id).bind({
    click: function() {
    alert("do something on click");
     },
    mouseenter: function() {
    alert("do something on mouseenter"); 
});

但如果您动态添加输入，我建议您使用此代码：

$(document).on('click','#date_new_'+user_id, function() {
    alert("do something on click");
     } 
});
$(document).on('mouseenter','#date_new_'+user_id, function() {
    alert("do something on mouseenter");
     } 
});

动态HTML元素创建后，JQuery无法绑定函数

2 个答案: