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>

更新：谢谢大家。我找到了这个bug。罪魁祸首是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对象。

Answer 2

由于很多原因，我重写了很多代码。比较两者。

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

function addnew(n) {
    var div = $("#Inputfields" + n);
    var howManyInputs = (div.children("input").length) / 4;
    alert(howManyInputs);
    var myi = (howManyInputs) + '_' + n + '"';
    var val = div.data("addedCount");

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

Jquery没有正确附加值

2 个答案: