Jquery 为分配给变量的name属性设置事件处理程序的键

我想为页面上的每个文本字段创建一个keyup事件。我最终将有两个文本字段，都具有不同的名称属性。（示例中只有一个文本字段。）每个文本字段都将通过按我分配给它的按钮来创建。问题:

我可以为每个文本字段创建一个keyup事件吗

如果在创建文本字段之前调用keyup处理程序函数，keyup函数会在新文本字段上启动吗

我想在函数txtField中使用变量名来分配keyup处理程序。这将为文本字段创建一个keyup事件处理程序，其name属性与my fieldName变量的值匹配。这可能吗$（“[name=fieldName]”）。键控（myFunction）似乎不起作用

有没有更好的方法来做我想做的事

// creates a text field
function txtField(fieldName, fieldVal){
    var objTxtField = document.createElement("input");
    objTxtField.type = "text";
    objTxtField.name = fieldName;
    objTxtField.value = fieldVal;
    return objTxtField;
};

// button fires this function
// if there is no appended text field, create one and give it focus
function appendNewField() {
    if ($('[name="appTxtField"]').length === 0) {
        var newTxtField = new txtField("appTxtField", "");
        $("#mainDiv").append(newTxtField);
    };
    $('[name="appTxtField"]').focus();
};

var$mainDiv=$（“#mainDiv”）；
//创建一个文本字段
函数txtField（名称，val）{
return$（“”，{//返回一个新的输入
name:name，//分配属性
值：val，
keyup:function（）{//和JS事件
警报（“钥匙打开！耶”）；
}
});
}
//按钮启动此功能
//如果没有附加文本字段，请创建一个并将其设置为焦点
函数appendNewField（）{
如果（$（'[name=“appTxtField”]'）。长度==0）{
var$newField=txtField（“appTxtField”，“”）；//创建它
$mainDiv.append（$newField）；//追加它
$newField.focus（）；//聚焦它
}
}
$（“按钮”）。打开（“单击”，添加新字段）

添加字段

var$mainDiv=$（“#mainDiv”）；
//创建一个文本字段
函数txtField（名称，val）{
return$（“”，{//返回一个新的输入
name:name，//分配属性
值：val，
keyup:function（）{//和JS事件
警报（“钥匙打开！耶”）；
}
});
}
//按钮启动此功能
//如果没有附加文本字段，请创建一个并将其设置为焦点
函数appendNewField（）{
如果（$（'[name=“appTxtField”]'）。长度==0）{
var$newField=txtField（“appTxtField”，“”）；//创建它
$mainDiv.append（$newField）；//追加它
$newField.focus（）；//聚焦它
}
}
$（“按钮”）。打开（“单击”，添加新字段）

添加字段

是的，你可以（听起来像是竞选口号，我知道）你应该读到
不，将事件绑定到不存在的元素将不会触发，除非使用jquery的委托语法。再次

“txtField”函数没有错，您可以通过多种方式使用jQuery来实现这一点，但没有理由这样做
因为jQuery抽象在这样一个简单的操作中是不必要的

“appendNewField”-可以而且应该改进，原因如下：


每次调用函数时都会查找$（'[name=“appTxtField”]'），这很糟糕。这实际上是在寻找节点&在每次运行时构造该节点的jquery实例（mainDiv也是如此）

我要做的是在“appendNewField”外部作用域中设置一个引用，并在每次调用中使用jquery的find方法。例如：

var mainDiv = $("#mainDiv");

function txtField( fieldName, fieldVal ) { ... };

function appendNewField() {
    if ( mainDiv.find( '[name="appTxtField"]' ).length === 0 ) {
        // utilize the chaining api and use focus directly after the appending.
        $( new txtField("appTxtField", "") ).appendTo( mainDiv ).focus();
    };
}

是的，你可以（听起来像是竞选口号，我知道）你应该读到
不，将事件绑定到不存在的元素将不会触发，除非使用jquery的委托语法。再次

“txtField”函数没有错，您可以通过多种方式使用jQuery来实现这一点，但没有理由这样做
因为jQuery抽象在这样一个简单的操作中是不必要的

“appendNewField”-可以而且应该改进，原因如下：


每次调用函数时都会查找$（'[name=“appTxtField”]'），这很糟糕。这实际上是在寻找节点&在每次运行时构造该节点的jquery实例（mainDiv也是如此）

我要做的是在“appendNewField”外部作用域中设置一个引用，并在每次调用中使用jquery的find方法。例如：

var mainDiv = $("#mainDiv");

function txtField( fieldName, fieldVal ) { ... };

function appendNewField() {
    if ( mainDiv.find( '[name="appTxtField"]' ).length === 0 ) {
        // utilize the chaining api and use focus directly after the appending.
        $( new txtField("appTxtField", "") ).appendTo( mainDiv ).focus();
    };
}

在你的例子中，你到底是什么？@RokoC.Buljan sarcasm适合你：）我纠正了我的例子。为什么
if（输入类型！=“未定义”）{
？很好也很整洁。我喜欢代码中的这一点。我想在最后一行也加入一个keyup事件处理程序。我假设我可以用正常的jQuery方式来做。它应该可以工作，对吗？@KrisHanson是的，它应该是你到底是什么
。focus（）
在你的示例中使用什么？@RokoC.Buljan sarcasm:）我更正了我的示例。为什么
如果（输入类型！==“undefined”）{
？很好，很简洁。我喜欢代码中的这一点。我想在最后一行也加入一个keyup事件处理程序。我想我可以用正常的jQuery方式来做。应该可以，对吗？@KrisHanson是的，应该可以