我的 jquery 有問題
我想洗掉一些產品
但唯一的問題是，即使我單擊最后一項，洗掉也僅適用于第一項
可以說我要洗掉<p>INFO 20002</p>它會洗掉 <p>INFO 2000</p>
我希望能夠洗掉我想要的任何專案
<script>
function callB() {
$("#button1").click(function(event) {
Execute();
});
function Execute() {
$.ajax({
type: 'POST',
url: 'ajax/file.aspx',
data: {
'custId': $("input[name='custId']").val()
},
success: function(response) {
},
error: function() {
alert("error");
}
});
};
}
$(document).ready(function() {
callB();
});
</script>
<div>
<p>INFO 2000</p>
<input type="button" id="button1" value="Erase this">
<input type="hidden" name="custId" value="348700">
</div>
<div>
<p>INFO 20001</p>
<input type="button" id="button1" value="Erase this">
<input type="hidden" name="custId" value="4443487">
</div>
<div>
<p>INFO 20002</p>
<input type="button" id="button1" value="Erase this">
<input type="hidden" name="custId" value="8883487">
</div>
<div>
<p>INFO 20003</p>
<input type="button" id="button1" value="Erase this">
<input type="hidden" name="custId" value="1113487">
</div>
uj5u.com熱心網友回復：
您的輸入按鈕需要具有唯一的 id 屬性（或者在這種情況下根本沒有 id）。
給他們所有相同的類名。
<input type="button" class="deleteButton" value="Erase this" />
將客戶 ID 放入“按鈕”元素，而不是其自己的隱藏輸入。
<input type="button" class="deleteButton" value="Erase this" data-custid="348700" />
然后為按鈕單擊事件更新您的 jquery 選擇器，并參考該類名。
$('input.deleteButton').on('click', function(event) {
var $button = $(this);
// USE THE jQUERY OBJECT'S .data() METHOD TO GET THE BUTTON's CUST-ID
// var customerId = $button.data('custid');
Execute($button);
});
然后，在 ajax 請求“成功”時，參考“$button”物件，并洗掉<div>其父物件。
$button.closest('div').remove();
uj5u.com熱心網友回復：
因為你所有的按鈕都有相同的，ids即button1當你點擊任何按鈕時，你的函式Execute();執行并且在你的ajax資料中你發送資料$("input[name='custId']").val()意味著它總是會給你第一次出現的值，這就是為什么點擊任何按鈕時，因為你的所有按鈕都有相同的 idExecute()執行的功能和您的第一個專案已洗掉。因此，當您單擊任何按鈕發送單擊的按鈕值時，您的問題將得到解決。也請嘗試給出id價值unique。
$("[type=button]").on('click', function() {
var custId = $(this).closest('div').find('[name=custId]').val();
Execute(custId);
});
function Execute(custId) {
$.ajax({
type: 'POST',
url: 'ajax/file.aspx',
data: {
'custId': custId
},
success: function(response) {
},
error: function() {
alert("error");
}
});
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/416973.html
標籤：
上一篇：單擊表格中的行以從子元素獲取資訊