gpt4 book ai didi

javascript - 向附加元素添加删除按钮

转载 作者:搜寻专家 更新时间:2023-11-01 05:04:41 25 4
gpt4 key购买 nike

我的代码附在下面。

$('#aprod').on('click', function() {
$('#ln1').clone().appendTo('#page3_inside');
prodnum = prodnum + 1;
$('#conf_prodnum').val(prodnum);
});

$('body').on('click', '.del', function() {
$(this).closest('tr').remove();
});
<html>
<head>
<meta name="generator"
content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<title></title>
</head>
<body>
<form>
<input type='button' value='Add Another Product' id='aprod' />
</form>
<table id='page3_inside'>
<tr id='ln1'>
<td>
<label for="product_name">Product Name</label>
<br />
<select class='input name_of_product' style='width:150px; height:34px;' name="name_of_product[]">
<option value="">Select from List</option>
</select>
</td>
<td>
<label for="product_cat">Product Category</label>
<br />
<input type='text' class="input product_category" name="product_category[]"
style="font-family:verdana; width:150px; border: 1px solid #000000;" readonly="readonly" />
</td>
<td>
<label for="qty">Qty</label>
<br />
<input type="text" value="" class="input qty" style="width:100px;" name="qty[]" placeholder="Qty"
onkeypress="return isNumberKey(event)" />
</td>
<td>
<label for="unit">Unit</label>
<br />
<input type='text' class="input unit" style="width:100px;" name="unit[]" readonly="readonly" />
</td>
<td>
<label for="brand">PO Number</label>
<br />
<input type="text" value="" class="input po" name="po[]" placeholder="PO Number"
style='width:150px; height:28px;' />
</td>
<td>
<img src='http://www.oasisservicedoffices.co.uk/wp-content/uploads/2014/08/Delete-button-150x150.jpg'
class='del' width='30px' style='cursor:hand;cursor:pointer;' />
</td>
</tr>
</table>
</body>
</html>

$('body').on('click', '.del', function() {
$(this).closest('tr').remove();
});

我为附加元素创建了一个删除按钮。但如您所见,第一行有一个删除按钮。我想要做的是删除该删除按钮,并且仅在按下“添加另一个产品”按钮时才将其显示在下一行。

 $('#aprod').on('click', function() {
$('#ln1').clone().appendTo('#page3_inside');
prodnum = prodnum + 1;
$('#conf_prodnum').val(prodnum);
});

最佳答案

你可以用 css 隐藏第一个删除按钮

table tr:first-child .del{
display: none;
}

DEMO

关于javascript - 向附加元素添加删除按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30473892/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com