javascript - Jquery 未正确附加值

Question

我在页面加载时有一组固定的输入字段。我有显示值的复选框，当有人选中该复选框时，值将添加到输入字段。如果所有输入字段均已填写，则会创建一个新字段。我的问题是，复选框值已正确插入到现有输入字段中，如果该值超过，则会创建一个新的输入字段，但在创建输入字段时不会立即插入值。只有在下一次单击时，才会将值插入新创建的输入字段。这是代码

<script>
    function fillin(entire,name,id,key) {
        if (entire.checked == true) {
            var split_info = new Array();
            split_info = name.split(":"); 
            var div = $("#Inputfields"+id);
            var till = (div.children("input").length)/4;
            var current_count = 0;
            for (var j=0;j<till;j++) {
                if (document.getElementById("insertname_"+j+"_"+id).value == "" && document.getElementById("insertnumber_"+j+"_"+id).value == "") {
                    document.getElementById("insertname_"+j+"_"+id).value = split_info[0];
                    document.getElementById("insertnumber_"+j+"_"+id).value = split_info[1];
                    break;
                } else
                    current_count = current_count+1;
                if (current_count == till) {
                    var x= addnew(id);
                    x =x+1;
                    $("#Inputfields"+id).find("#insertname_"+x+"_"+id).value = split_info[0];
                    alert($("#Inputfields"+id).find("#insertname_"+x+"_"+id).value);
                    document.getElementById("insertname_"+x+"_"+id).text = split_info[0];
                    //alert(document.getElementById("insertname_"+x+"_"+id).value);
                    //document.getElementById("insertnumber_"+x+"_"+id).value = split_info[1];
                }
            }
        } else {
        }
    }
</script>

<script>
function addnew(n) {
    //var id = $(this).attr("id");
    var div = $("#Inputfields"+n);
    var howManyInputs = (div.children("input").length)/4;
    alert(howManyInputs);
    var val = $("div").data("addedCount");

    var a = '<input type="search" id="insertinstitute_'+(howManyInputs)+'_'+n+'" placeholder="Institute" class="span3">';
    var b =  '<input type="search" id="insertname_'+(howManyInputs)+'_'+n+'" placeholder="name" class="span3">';
    var c =  '<input type="search" name="" id="insertnumber_'+(howManyInputs)+'_'+n+'" placeholder="number" class="span3">';
    var d =  '<input type="search" name="" id="insertarea_'+(howManyInputs)+'_'+n+'" placeholder="area" class="span3">';
    var fin = a+b+d+c;
    $(fin).appendTo(div);
    div.data("addedCount", div.data("addedCount") + 1);
    return howManyInputs;
}
</script>

更新:谢谢大家。我能够找到该错误。罪魁祸首是x =x+1;。应该是x

Answer 1

问题可能出在这里:

document.getElementById("insertname_"+x+"_"+id).text

元素中没有 text 属性。有 textContent(IE8- 中没有)、innerText(IE 中)和 innerHTML。不过，jQuery 中有 text 方法。所以你可以这样做:

document.getElementById("insertname_"+x+"_"+id).innerHTML = ...

或

$("#insertname_"+x+"_"+id).text(...);

此外，这些行:

$("#Inputfields"+id).find("#insertname_"+x+"_"+id).value = split_info[0];
alert($("#Inputfields"+id).find("#insertname_"+x+"_"+id).value);

.value 应该替换为 .val()，因为它们是 jQuery 对象。