如何使用JQuery动态创建输入元素实现keyup函数

How do I implement a keyup function with a dynamically create input element with JQuery?

本文关键字:元素 实现 keyup 函数 输入 创建 何使用 JQuery 动态      更新时间:2023-09-26

我不明白为什么下面的代码不工作。JSFIDDLE链接

$(document).ready(function () {
    addInput();
});
var limit = 30;
function addInput() {
    var numberOfRows = $("#shipping tr").size();
    var id = numberOfRows;
    if (numberOfRows == limit) {
        alert("You have reached the limit of adding " + limit + " inputs");
    } else {
        $('#shipping').append('<tr id="rate' + id + '"></tr>');
        $('tr#rate' + id).append('<td></td>');
        $('tr#rate' + id).append('<td><input type="text" name="rate" /></td>');
    }
    $('input[name=rate]').on('keyup', 'input', function () {
        alert('YAY');
        return false;
    });
}

我正在尝试为我动态添加的输入分配一个keyup函数。

期望输出:YAY!弹出框内部

请帮忙!

将keyup事件处理程序附加到发货表,事件将从input[name="rate"]冒冒到发货表:

$('#shipping').on('keyup', 'input[name="rate"]', function () {
    alert('YAY');
    return false;
});

您需要添加委托给document,因为它已添加到document

$(document).on('keyup', 'input[name="rate"]', function () {
    alert('YAY ');
});

Working Demo