Question

我有一个div，其中包含一个包含数据的下拉列表和一个input类型的文本日期选择器和一个文本框。我希望使用div id的新clone，输入类型日期选择器，文本框和下拉列表以及绑定数据到克隆下拉列表来复制var toAddCloneCount = 0; function AddDestination() { var clone = $("#toAdd").clone(true); clone.show(); clone.attr('id', 'toAdd' + toAddCloneCount++).insertAfter("#toAdd"); clone.find("#days").attr('id', 'days' + toAddCloneCount); clone.appendTo("#destinations"); }。我怎样才能做到这一点？

我使用下面的代码克隆它，更改div的id而不是其子元素，克隆的输入类型文本日期选择器被禁用。

＆＃13;

<div id="destinations">
    <div id="toAdd">
        <table style="width: 100%;">
            <tr>
                <td class="auto-style8">To </td>
                <td>
                    <asp:DropDownList ID="dropDownList2" runat="server" onchange="CheckCity()" DataValueField="CityId" DataTextField="CityName" Height="100%" Width="95%"></asp:DropDownList>
                </td>
                <td>Days to Stay</td>
                <td>
                    <asp:TextBox ID="days" Width="30%" Height="100%"  onkeypress="return false" onKeyDown="return false" TextMode="Number" Min="1"  runat="server" Text="1"></asp:TextBox>
                </td>
                <td>
                    <p>
                        Date: 
                        <input type="text" class="getCurrentDate"  id="toDate" onkeypress="return false" onkeydown="return false" />
                    </p>
                </td>
                <td>
                    <asp:LinkButton ID="LinkButton2" OnClientClick="AddDestination(); return false;" CssClass="divshow" runat="server">+Add</asp:LinkButton>
                </td>
            </tr>
        </table>
    </div>
</div>

＆＃13;

*UITableView

＆＃13;

Answer 1

这是一个克隆机制，克隆事件以及http://jsfiddle.net/dg30gj27/。

注意，您在示例中使用的是asp标记，您应该在示例中使用HTML标记： http://code.runnable.com/UjB_wxmQpvw8AAAw/asp-net-how-to-use-dropdownlist 点击运行并检查生成的Html。

此处提供的此方法克隆了所有客户端事件，您可能遇到代码隐藏的事件处理问题，您需要检查事件源以便在服务器上执行正确的操作。

// Original element with attached data
var $elem = $( "#destinations" ).data( "arr", [ 1 ] ),
    //withDataAndEvents (default: false) Type: Boolean"
    cloned = $elem.clone( true )
    // Deep copy to prevent data sharing
    .data( "arr", $.extend( [], $elem.data( "arr" ) ) );

cloned.attr("id", cloned.attr("id") + "_cloned");
cloned.find( "*" ).each(function(){
    if ($(this).attr("id") != undefined && $(this).attr("id").length > 0)
    {
        $(this).attr("id", $(this).attr("id") + "_cloned");
    }
});
console.log(cloned);
cloned.prependTo(".wrapper");

如何使用绑定数据的下拉列表进行克隆？

1 个答案: