设置动态生成的 DIV 输入字段的值答案

【问题标题】：Set the Value of Dynamically Generated DIV input Fields设置动态生成的 DIV 输入字段的值
【发布时间】：2011-03-30 18:34:48
【问题描述】：

尊敬的专家，我正在关注 Mr.Steve Sanderson Example 处理可变长度列表，ASP.NET MVC 2 样式。

在我的场景中，我有一个文本框，用户在其中通过条形码扫描仪进行扫描，扫描的条形码值将分布在变量列表输入字段中。

我正在使用 JQuery 来设置这些生成字段的值，

动态生成DIV的例子是

<div class="editorRow">
<input type="hidden" name="gifts.index" autocomplete="off" value="a041d40e-d016-4543-b3f1-bf72239e1377" />

   Area Code <input id="gifts_a041d40e-d016-4543-b3f1-bf72239e1377__AreaCode" name="gifts[a041d40e-d016-4543-b3f1-bf72239e1377].AreaCode" type="text" value="0" /> 
   Account No: <input id="gifts_a041d40e-d016-4543-b3f1-bf72239e1377__ConsCode" name="gifts[a041d40e-d016-4543-b3f1-bf72239e1377].ConsCode" type="text" value="0" /> 
   Amount: <input id="gifts_a041d40e-d016-4543-b3f1-bf72239e1377__CAmount" name="gifts[a041d40e-d016-4543-b3f1-bf72239e1377].CAmount" type="text" value="0" /> 
   Coll No: <input Value="1" id="gifts_a041d40e-d016-4543-b3f1-bf72239e1377__CollNo" name="gifts[a041d40e-d016-4543-b3f1-bf72239e1377].CollNo" type="text" value="1" /> 
   <a href="#" class="deleteRow">delete</a>

    <span class="field-validation-valid" id="gifts_a041d40e-d016-4543-b3f1-bf72239e1377__AreaCode_validationMessage"></span>
    <span class="field-validation-valid" id="gifts_a041d40e-d016-4543-b3f1-bf72239e1377__ConsCode_validationMessage"></span>
    <span class="field-validation-valid" id="gifts_a041d40e-d016-4543-b3f1-bf72239e1377__CAmount_validationMessage"></span>

如果您看到有一个隐藏字段的索引和值 =“a041d40e-d016-4543-b3f1-bf72239e1377”，这在其他成员中很常见。当我再添加一个 DIV 时，隐藏的输入值再次发生变化，并且该 div 的所有成员都具有相同的公共值。

我不知道如何处理它，到目前为止，我已经成功地将扫描条形码的值分配到动态 DIV 之外的输入框，例如：

$("#ScanBCode").keyup(function (e) {
barCode = $("#ScanBCode").val();
if (barCode.length == 21) {
    var count = 1;
    Checking(count);
}

function Checking(count) {
    var code = barCode.substr(2, 3);
    var ACode = barCode.substr(5, 3);
    var Ccode = barCode.substr(8, 5);
    var Amount = barCode.substr(13, 8) / 1000;
    $("#TabACode").val(ACode);
    $("#TabCCode").val(Ccode);
    $("#TabAmount").val(Amount);
    $("#TabCollNo").val(code);
    $("#ScanBCode").val("");
}

});

任何想法

【问题讨论】：

标签： jquery asp.net-mvc-2

【解决方案1】：

不确定我是否正确，但您似乎正在寻找一种循环遍历 jquery 集合的方法，这可以使用 jQuery.each 来完成。

因此，与其注意输入字段中生成的一些 ID，我建议循环遍历所有生成的“字段”，并由它们的类 editorRow 标识。请注意，您不必为每个输入字段设置一个单独的 id，而是必须在它们上设置一些类，例如：

<div class="editorRow">
   <!-- set a class on your input fields -->
   Area Code <input class="areaCode" type="text" value="..." />
</div>

现在您可以在 keyup 处理程序中应用以下 javascript：

$('.editorRow').each(function(){
  var $row = $(this);
  $('.areaCode', $row).val('somevalue');  //do this for all of your input fields
});

如果这里有不清楚的地方，请回帖。

【讨论】：

我想投票赞成你的答案，但它需要 15 个声誉，而我现在只有 5 个 :(
谢谢..您的回答对我帮助很大..再次感谢先生

【解决方案2】：

你的工作很好，我的工作代码是，

$("#ScanBCode").keyup(function (e) {
    barCode = $("#ScanBCode").val();

    if (barCode.length == 21) {
        var code = barCode.substr(2, 3);
        var ACode = barCode.substr(5, 3);
        var Ccode = barCode.substr(8, 5);
        var Amount = barCode.substr(13, 8) / 1000;

        $('.editorRow').each(function () {
            var $row = $(this);
            var chk = $('.text-box-Area', $row).val();
            //alert(chk);
            if (chk == 0) {
                $('.text-box-Area', $row).val(ACode);
                $('.text-box-Cons', $row).val(Ccode);
                $('.text-box-coll', $row).val(code);
                $('.text-box-Amount', $row).val(Amount);
                $("#ScanBCode").val("");

            }
        });
    }

});

【讨论】：