如何通过下拉框的值获取表格数量

2019-07-16 13:49发布

问题:

当我选中4的时候如何使得下个页面的表格自动添加到四行并使得序号加1的自增,用循环的话要怎么获取到下拉框的值

回答1:

js:

//选择成人票数
$("#Crrs").on("change", function () {
    var Crrs = $('#Crrs').val();
    var len = maxLength - parseInt(Crrs);
    setErtong(len);//根据已选择的成人票数,决定儿童和婴儿的票数上限
    setYinger(len);
    addCrrsData(parseInt(Crrs), '成人');
});

//添加成人机票信息
function addCrrsData(length, type) {
    var html = "";
    for (var i = 0; i < length; i++) {
        html += "<tr>";
        html += "<td>" + (i + 1) + "</td> ";
        html += "<td>" + type + "</td>";
        html += "<td><input id='crrsName" + i + "' /></td>";
        html += "<td><select id='crrsType" + i + "' ><option value='0' selected='selected'>身份证</option><option value='1'>护照</option></select></td>";
        html += "<td><input id='crrsNum" + i + "' /></td>";
        html += "<td>CZ:<input id='czNum" + i + "' /></td>";
        html += "</tr>";
    }
    $('#data').html(html);
}

html:

 <table style="width: 768px; font-size: 14px; margin-top: 20px;">
     <thead>
         <tr>
             <th>序号</th>
             <th>类型</th>
             <th>旅客姓名</th>
             <th>证件类型</th>
             <th>证件号码</th>
             <th>明珠卡号</th>
         </tr>
     </thead>
     <tbody id="data">
     </tbody>
    </table>


回答2:

第一步:选择N个人数的时候,循环次数为N,通过append方法追加html到指定dom节点下即可。
第二步:取值的时候,通过$(document).find("dom元素") 去取元素,再去取值。因为动态追加的dom元素直接$("dom元素")是取不到的。而是需要先获取document文档,再查找文档里的指定元素。
动态追加的每行可以加个统一的class,通过JQ获取class的时候遍历下面的children节点,然后一个一个正常取值。



标签: Table