Question

我有下表，当我按下第一个按钮时，我调用jquery来克隆第一行并添加一个新行。

<table id='vehReg' class='table table-striped table-bordered bootstrap-datatable'  style='font-size:10px;table-layout: fixed;'>
                                     <thead>
                                         <tr>
                                              <th style='width: 10%;'>No.</th>
                                              <th style='width: 30%;'>Sel</th>
                                              <th style='width: 20%;'>Desc.</th>

                                              <th style='width: 18%;'><input type= 'button' value='Add Row'  id='addRow()' />
                                  <input type='hidden' value='0' id='totalRows' name='totalRows' /></th>
                                          </tr>
                                      </thead>
                                      <tbody>
                                      <tr>
                                        <td>
                                            1
                                        </td>
                                            <td>
                                                        <select class='sSelect' data-rel='chosen' style='font-size:10px;max-width:80%;'>
                                              </select> 

                                                <br\><p style='color:#FF0000;' type='text' class='srror' ></p>
                                            </td>
                                           <td>
                                                <input  style='font-size:10px;max-width:80%;' class='descInput' type='text' id='desc' name='desc' ><p style='color:#FF0000;' type='text' class='descError' ></p>
                                            </td>
                                            <td>
                                            </td>
                                          </tr>
                                      </tbody>

下面是我克隆的jquery。它克隆得很好现在的问题是，一旦它克隆我的选择不能再工作了。我只是不能选择组合框。需要进行任何调整我使用带有data-rel的bootstrap类型的组合框来提供在其中搜索的选项。

    $("#addRow").click(function(){

            var count = $("#vehReg tr").length;
            var $clone = $("#vehReg tbody tr:first").clone();
        $clone.attr({
            id: "emlRow_" + count,
            name: "emlRow_" + count,
            style: "" // remove "display:none"
        });
        $clone.find("input,select").each(function(){
            $(this).attr({
                id: $(this).attr("id") + count,
                name: $(this).attr("name") + count
            });
        });

        $("#vehReg tbody").append($clone);
});

Answer 1

我在我的机器上尝试了你的代码，它运行得很好。也许你的问题在于bootstrap组合框。因此，请尝试刷新或重置引导程序组合框。

我使用了类似的plugin并遇到了类似的问题。所以我使用了它，它解决了我的问题。

$("#select").selectpicker('refresh');

此外，我在上面粘贴的代码中发现了一个小错误。

<input type= 'button' value='Add Row' id='addRow' />

而不是像

id='addRow()'

所以这里是选择插件的更新代码。

<script type="text/javascript">
    $(document).ready(function(){
        $("#addRow").click(function(){
            var row = "<tr>"+
                    "<td></td>"+
                    "<td><select class='chosen-select'> <option>1 --</option> <option>2 --</option> <option>3 --</option> <option>4 --</option> <option>5 --</option> <option>6 --</option> <option>7 --</option> <option>8 --</option> </select></td>"+
                    "<td><input  style='font-size:10px;max-width:80%;' class='descInput' type='text' id='desc' name='desc' ></td>"+
                    "</tr>";
            $("#vehReg tbody").append(row);
            $(".chosen-select").chosen();
        });
    });
</script>
<body>
    <table id='vehReg'>
        <thead>
            <tr>
                <th>No.</th> <th>Sel</th> <th>Desc.</th>
                <th ><input type= 'button' value='Add Row' id='addRow' />
                    <input type='hidden' value='0' id='totalRows' name='totalRows' /></th>
                </tr>
            </thead>
            <tbody>

            </tbody>
        </table>
</body>

希望这有帮助。

我在javascript本身而不是克隆功能中添加了代码。通过这种方式，您可以更轻松地维护计数并继续向字段添加命名约定。

Answer 2

当你将输入使用id声明为addRow而不是addRow（）时，问题就出现了。

import Foundation

class ClassType<T> {

    static func name () -> String
    {
        return "\(T.self)".componentsSeparatedByString(".").last!
    }
}

class MyClass {

}

func testClassName(){

    let className = ClassType<MyClass>.name()
    print(className)
}

testClassName()

jquery clone组合框无法正常工作

2 个答案: