Question

所以我有一个文本字段：

number of weeks <div id = "weekcount"><input type="text" id="numweeks" name="numweeks" value="" class = "dialog_inputfield" /></div><br />

一个Javascript函数，用于检查该文本字段中的值是否随时更改：

$('#numweeks').keyup(function(event) {
        var date = $('#datepicker').val();
        var numWeeks = $('#numweeks').val();
        change(calculate(date, numWeeks));
});

这很好用。但是我使用innerHTML来改变id与＃34; weekcount＆＃34;要包含另一个文本字段，我将其更改回原始文本字段：

document.getElementById('weekcount').innerHTML = '<input type="text" id="numweeks" name="numweeks"  value="" class = "dialog_inputfield" />'

之后，即使id与以前相同，keyup也不再有效。有什么我做错了吗？感谢。

Answer 1

您目前正在直接绑定到DOM元素，但会被innerHTML赋值取代，从而也会丢失事件绑定（它是一个新的DOM元素）。

您想要的是使用委派（“现场”）事件。看看jQuery on function，它很好地统一了所有事件处理模式。

$('#weekcount').on('keyup', '#numweeks', function(event) {
        var date = $('#datepicker').val();
        var numWeeks = $('#numweeks').val();
        change(calculate(date, numWeeks));
});

使用innerHTML打破了键盘功能

1 个答案: