javascript - 尝试使用 jQuery 查找在 HTML 页面中动态创建的输入变量

标签 javascript jquery html

<分区>

我正在尝试根据用户请求找到我在 div 中附加的特定输入变量。

创建输入变量后,我需要先验证输入标签中的内容,然后才能继续。但是我无法在 jQuery 中找到这些变量..

感谢任何帮助。

$("#txtNoOfAccounts").on("focusout", function () {
    var count = parseInt($("#txtNoOfAccounts").val());
    $("#lblSuccess").text(' ');
    $("#lblError").text(' ');
    if (count.toString() != "NaN") {
    $("#accountDiv").empty();

    for (var i = 0; i < count; i++) {
        $("#accountDiv").append(
       "<div class='divTableRow' style='width: 100%'>" +
           "<div class='divTableCell' style='width: 40%;padding-left:0;'>" + "<input type='text' name='AccountNo_" + i.toString() + "'" + " class='txtAccountNo' /></div>" +
          "<div class='divTableCell' style='width: 40%'>" + "<input type='text' name='Suffix_" + i.toString() + "'" + " class='txtSuffix' /></div>
       </div>")
     }
    }
});

如何找到 txtSuffix 输入变量。

我试过:

$('.txtSuffix').focusout(function (e) {
    alert("Control Found");
});

我无法使用 jQuery 找到这些变量。

感谢任何帮助。

最佳答案

使用 jQuery,解决这个问题的一种方法是使用 .on() Event Handler Attachment

$("#txtNoOfAccounts").on("focusout", function() {
    var count = parseInt($("#txtNoOfAccounts").val());
    $("#lblSuccess").text(' ');
    $("#lblError").text(' ');
    if (count.toString() != "NaN") {
        $("#accountDiv").empty();
        for (var i = 0; i < count; i++) {
            $("#accountDiv").append(
                "<div class='divTableRow' style='width: 100%'>" +
                "<div class='divTableCell'  style='width: 40%;padding-left:0;'>" + "<input type='text' value='no event' name='AccountNo_" + i.toString() + "'" + " class='txtAccountNo' /></div>" +
                "<div class='divTableCell' style='width: 40%'>" + "<input type='text' value='with focusout event' name='Suffix_" + i.toString() + "'" + " class='txtSuffix' /></div></div>")
        }
    }
});

$(document).on('focusout', '.txtSuffix', function() {
    alert('Test');
});
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>title</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
  </head>
  <body>
    <input type="text" id="txtNoOfAccounts">
	<div id="accountDiv">
	</div>
  </body>
</html>

重要的是要确保具有此类 .txtSuffix所有 对象将遵循此行为。

关于javascript - 尝试使用 jQuery 查找在 HTML 页面中动态创建的输入变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42400317/

相关文章:

javascript - 使用 map 标准化数据失败

javascript - 对象创建期间的“this”上下文

javascript - 使用最少的 JQuery 显示放大图像的最佳方式是什么?

javascript - 使用 Javascript 将 HTML5 沙盒属性添加到 iframe

html - 浏览器对象模型和文档对象模型有什么区别?

php - 获取 wordpress 循环以在第二页上显示帖子

javascript - 复制时设置文本格式

javascript - 如何禁用 iOS HTML5 视频控件?

javascript - 在下拉列表中显示特定值

javascript - 每当发生变化时自动更新所有用户的 html dom