sys_Param.aspxという名前のファイルにある私のコードの最初のスニペット:
<div id="div_water" style="display: none" align="center">
<table width="100%" border="0" id="printTbl" align="center" cellpadding="5" cellspacing="1" class="table">
<tr class="TR_BG_list" id="printsizescroll" style="display:none">
<td align="right" class="list_link" style="width: 214px">
Resize the pictrue:
</td>
<td align="left" class="list_link">
Description:
<asp:TextBox ID="PrintSizeDec" runat="server" CssClass="form" style="width: 106px"/>
width|height:
<asp:TextBox ID="PrintSmallSize" runat="server" CssClass="form" style="width: 50px"/>
<label>
<input type="button" name="PintSizeAddClick" value="Add" class="form" id="ButtonAdd" style="width: 44px" onclick="createInputTexts(this)" />
</label>
<span class="helpstyle" style="cursor: help;" title="Click to get some help" onclick="Help('H_WaterParam_0008',this)">Help</span>
</td>
</tr>
<tr class="TR_BG_list">
<td align="center" colspan="2" class="list_link">
<label>
<input type="submit" name="Savewater" value=" Submit " class="form" id="Savewater" runat="server" onserverclick="Savewater_ServerClick" />
</label>
<label>
<input type="reset" name="Clearwater" value=" Reset " class="form" id="Clearwater" runat="server" />
</label>
</td>
</tr>
</table>
別の部分:イベントハンドラー:
function createInputTexts() {
var trOrigin = $("#printsizescroll");
var trClone = trOrigin.clone(true);
var target = $("#printTbl tr:last-child").prev();
trClone.find(":button").val("delete");
$('#printTbl').on('click', 'input[type="button"][value="delete"]', function () {
$(this).parent().parent().parent().remove();
});
trClone.css('display', '');
// Here you can also set new ID.
target.after(trClone);
}
問題は、削除ボタンをクリックしても、jQueryによって動的に作成された新しいクローン行が削除されないことです。クリックイベントをすべての削除ボタンにバインドしているため、混乱しました。何百万人ものおかげで、私はいくつかの助けが必要です。