jQuery的 - 從點擊事件

-1

得到不正確ID見例如：https://jsfiddle.net/DTcHh/25321/jQuery的 - 從點擊事件

你可以看到3個按鈕，每個按鈕都有data-entry-id屬性。

<button data-toggle="modal" data-target="#edit" data-entry-id="5"> Button 1</button> 
    <button data-toggle="modal" data-target="#edit" data-entry-id="10"> Button 2</button> 
    <button data-toggle="modal" data-target="#edit" data-entry-id="15"> Button 3</button>

當你點擊一個按鈕，它會從data-entry-id傳遞價值Save changes按鈕（data-id屬性）來引導模式。這是如何做到：

$('#edit').on('show.bs.modal', function(event) { 
     var thisModal = $(this); 
     var entryId = $(event.relatedTarget).data('entry-id'); 

     $('.btn-save', thisModal).attr('data-id', entryId); 
     $('.content-text', thisModal).html("Button Entry ID: " + entryId); 
    });

如果你點擊任何按鈕，然後點擊「保存更改」按鈕，從一個模式 - 它將從data-id屬性警報ID。問題是，當您點擊「保存更改」時，它不會顯示正確的ID。它與「保存更改」按鈕中的data-id屬性不匹配。這是什麼造成的？

$('body').on("click", ".btn-save", function (event) { 
    var id = $(this).data('id'); 
    alert(id); 
});

來源

2016-09-21 I' ll-Be-Back

不要混用'。數據（*'和' .attr（'data- *'。一個不更新其他。 –

爲什麼downvote嗯？ –

不要.data()和jQuery.attr使用data-*在一起，使用其中任何一個，都是不同的。

jQuery.data()不操作attribute反之亦然

$(function() { 

    $('#edit').on('show.bs.modal', function(event) { 
    var thisModal = $(this); 
    var entryId = $(event.relatedTarget).data('entry-id'); 
    alert(entryId) 
    $('.btn-save', thisModal).attr('data-id', entryId); 
    $('.content-text', thisModal).html("Button Entry ID: " + entryId); 
    }); 
}); 

$('body').on("click", ".btn-save", function(event) { 
    var id = $(this).attr('data-id'); 
    alert(id); 
});

Updated Fiddle

來源

2016-09-21 20:21:05 Rayon

啊我看，有可能有'$（this）.data（'id'）;'工作嗎？我假設我需要替換'.attr（'data-id'，entryId）;'to something ？ –

@ I'll-Be-Back - 既可以在分配的時候粘貼到'jQuery.data（）'，也可以在檢索或使用'jQuery.attr'時代替！ – Rayon

非常感謝。有沒有辦法通過'$（event.relatedTarget）'（按鈕元素）點擊事件？例如，我可以在$（'body'）。on（「click」，「.btn-save」，function（event）{}'塊中改變「Button 2」的背景顏色。 –

-1

$('body').on("click", ".btn-save", function (event) { 
    var id = $(this).attr('data-entry-id'); 
    alert(id); 
});

的數據屬性是屬性。所以你抓住他們就像抓住其他屬性一樣。

Updated Fiddle

來源

2016-09-21 20:17:53 Scott

鏈接似乎沒有更新。謝謝！ –

Jsfiddle保存速度慢..我很快就複製了，現在更新了。 – Scott

雖然我沒有你的代碼從你的問題的清晰畫面，我可以看到你正在使用：

$('body').on("click", ".btn-save", function (event) { 
    var id = $(this).data('id'); 
    alert(id); 
});

我認爲，當這個事件處理程序觸發$（這）指的是身體的元素。我可以假設，因爲你正試圖將數據保存到保存按鈕，你想要從保存按鈕的數據的ID如下：

var id = $(e.target).data('id');

來源

2016-09-21 20:29:01 klikas

jQuery的 - 從點擊事件

回答

相關問題