-1

我创建了类似休闲代码的东西：

<body>
    <table id="tab">
        <tr>1</tr>
        <tr>2</tr>
        <tr>3</tr>
        <tr>4</tr>
    </table>
    <button class="add-row">Add Row</button>
    <script src="jquery.js"></script>
    <script>
        $(document).ready(function(){

            $('.add-row').click(function(){
                var lttr = $('#tab tr:last-child');
                var currenttr =  1;
                for (currenttr; currenttr <= 10; currenttr++ ) {
                    lttr.after('<tr></tr>');
                }
            });

        });
    </script>
</body>

当您单击按钮时，此代码添加 10 行。但我的问题在这里：
我想在 for 循环中的项目之间添加我的数据属性（例如第 4 和第 5）！
 我的意思是这样的形式：

<tr></tr>
<tr></tr>
<tr></tr>
<tr date-my-attr="value"></tr>
<tr></tr>
<tr></tr>
<tr></tr> 
<tr></tr>
<tr></tr>

我怎样才能做到这一点...？

4

4 回答 4

2 
 $('.add-row').click(function(){
                var lttr = $('#tab tr:last-child');
                var currenttr =  1;
                for (currenttr; currenttr <= 10; currenttr++ ) {
                   if(currenttr==4 || currenttr==5 )
                   {
                    lttr.after('<tr date-my-attr="value" ></tr>');
                  } else{
                       lttr.after('<tr ></tr>');                   
                     }               
           }
         });
于 2013-11-15T11:22:10.753 回答
2

这会将属性添加到第 4 个表格行：

for (currenttr; currenttr <= 10; currenttr++ ) {
    if (currenttr == 4) {
        lttr.after('<tr date-my-attr="value"></tr>');
    }
    else {
        lttr.after('<tr></tr>');
    }
}
于 2013-11-15T11:22:44.673 回答
1

尝试这样的事情

        $(document).ready(function(){

            $('.add-row').click(function(){
                var currenttr =  1;
                var tr = ''
                for (currenttr; currenttr <= 10; currenttr++ ) {
                    if(currenttr == 4 || currenttr == 5){
                        tr += '<tr date-my-attr="value"></tr>';
                    }else{
                        tr += '<tr></tr>';
                    }
                }
                $('#tab').append(tr);
            });

        });
于 2013-11-15T11:29:59.317 回答
1

这应该会让您获得所需的结果：

$(".add-row").click(addTenRows);

function addTenRows() {
    var rows = $("<div>");

    while ($(rows).children().length <= 10)
        $(rows).append($("<tr/>"));

    $("tr:eq(3)", rows).attr({"date-my-attr": "value"});

    $("#tab").append($(rows).children());
}
于 2013-11-15T11:36:02.037 回答