為什么我的 jQuery Ajax json 數組數據會重復？

Question

不知道為什么會發生這種情況，也許我將代碼放在一起 - 或者可能是完全不同的問題。 在這種情況下尋找專業知識。 我正在嘗試一個基本示例，其中從數據庫中填充選擇數據：

      <div class="col-md-4 mb-3">
        <label for="producer">Select Producers</label>
        <?php if ($data): ?>
        <select class="custom-select d-block w-100" name="producer[]" id="producer" required="" size="5" multiple>
            <?php foreach($data as $row): ?>
                <option value=<?php echo $row['Id'] ?> ><?= $row['producer_name'] ?></option>
            <?php endforeach ?>
        </select>
        <?php else: ?>
            No data found
        <?php endif ?>
        <button class="btn btn-danger btn-sm" type="submit" id="del_producer">Delete</button>
        <div id="asd"></div>
      </div>

有一個按鈕可以通過ajax將多個選定的數據發送到另一個php頁面。 這是代碼。

$('#producer').on('click', function(event){
var prodId=' ';
prodId = $(this).val();
var jsonString = JSON.stringify(prodId);
document.getElementById("asd").innerHTML = jsonString;
if (prodId!=""){
  $("#del_producer").click(function(){
    $("#del_producer").attr("disabled", "disabled");
    $.ajax({
            url: "delete.php",
            type: "POST",
            data: {data : jsonString},
            cache: false,
            success: function(result){
                $("#del_producer").removeAttr("disabled");
                prodId = '';
                alert(result);
                console.log(result);
            }
        });
  });
}
    else{
        alert('Please select producer to delete!');
    }
});

#asd 只是在發送之前檢查所選值是否正確。 是的，它是正確的。 現在我的 php 文件看起來像這樣：

    $data = json_decode(stripslashes($_POST['data']));
    $array = implode(',', $data);
    echo $array;

是的，只需三行即可返回我發送的內容。 現在問題來了：我正在發送 3 個 id 值 [2,3,5] 它也在 #asd 中顯示。 現在，當我單擊按鈕時 - 我收到的響應是 [2] 、 [2,3] 、 [2,3,5] - 三個響應。 它應該是我缺少的東西。 有人可以指出它。 當我發送時，我需要它是 [2,3,5]。

Answer 1

從您的 jQuery 代碼的外觀來看，我的猜測是這段代碼：

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

...可能會在del_producer上堆積多個點擊偵聽del_producer 。 您需要使您添加的最新偵聽器函數成為唯一的點擊偵聽器。

$('#producer').on('click', function(event){ ，但我必須查看更多代碼的上下文才能知道那里是否存在相同的問題好吧。要記住的重要一點是，無論何時執行.on('some-event', my_function... than 都不會替換該事件類型的任何現有偵聽器函數，它只會添加新的偵聽器函數。