簡體   English   中英

如何以html形式從動態字段數輸入數據

[英]How To Input Data from dynamic number of fields in html form

這段代碼是創建動態數量的字段並發送數據..這樣做是可行的...但是然后我嘗試使用back.php(form發送數據),我不知道要獲取確切的數量行... id = 0_1 .... 3_1有很多選擇..但是要計數成一個循環的確切數字是多少...請盡快幫助我...

<html>
    <head>
        <title>Infinite Form Rows</title>
        <script 
            type="text/javascript" 
            src="http://cachefile.net/scripts/jquery/1.2.3/jquery-1.2.3.min.js">
        </script>
        <script type="text/javascript">
        $(function(){

            var newRowNum = 0;


            $('#addnew').click(function(){

                newRowNum += 1;


                var addRow = $(this).parent().parent();

                var newRow = addRow.clone();


                $('input', addRow).val('');


                $('td:first-child', newRow).html(newRowNum);



                $('input', newRow).each(function(i){
                    var newID = newRowNum + '_' + i;
                    $(this).attr('id',newID).attr('name',newID);
                });


                addRow.before(newRow);


                $('a.remove', newRow).click(function(){
                    $(this).parent().parent().remove();
                    return false;               
                });


                return false;
            });
        });
        </script>
    </head>
    <body>
        <form action="back.php" method="get"   >
            <table id="tabdata">
                <thead>
                    <tr>
                        <th>Row</th>
                        <th>Cell 1</th>
                        <th>Cell 2</th>
                        <th>Cell 3</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td><a id="addnew" href="">Add</a></td>
                        <td><input id="n0_1" name="n0_1" type="text" /></td>
                        <td><input id="n0_2" name="n0_2" type="text" /></td>
                        <td><input id="n0_3" name="n0_3" type="text" /></td>

                        <td></td>
                    </tr>
                    <tr>

                    </tr>
                </tbody>
            </table>

            <input id="go" name="go" type="submit" value=" Save " />
        </form>
    </body>
</html>

您可以維護包含當前行數的隱藏輸入。 在click事件處理程序上為#go設置值。

$('#go').click(function() {
    var numRows =$('#tabdata tbody tr').length;
    $('#myHiddenInput').val(numRows);
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM