訪問動態生成的元素

添加動態添加的元素時，如何獲取該元素的屬性（例如，單擊它時）？我發現我需要委託一個事件，但我仍然無法訪問該事件的任何屬性。訪問動態生成的元素

此的jsfiddle顯示了發行的問題：https://jsfiddle.net/wgc499n9/

$(this).data('index')出來作爲「未定義」 - 我想$(this)被引用「文件」，而不是.remove_link;即使event數據似乎也沒有任何有用的信息。 $(this).attr('id')也出現'未定義'。

最後，我只需要能夠點擊該鏈接刪除它所在的行。我怎麼能做到這一點？我甚至嘗試了內聯JS，但是這導致了更奇怪的行爲。

P.S.我還了解到，我的動態添加的data-index屬性未存儲在DOM中; jQuery單獨存儲它，所以它的包含元素必須通過使用.find() ...但我不知道如何使用.find()來訪問我需要的特定單個元素。

來源

2017-07-06 CJG

使用元素事件（E）參數，而不是這樣的：

let i = 0; 
 
$('#add').on('click',() => { 
 
    $('#container').append(`<div>row #${(i+1)} <a "href="#" data-index="${i}" class="remove_link">remove</a></div>`); 
 
    i++; 
 
}) 
 

 
$(document).on('click', '.remove_link', (e) => { 
 
    //alert(JSON.stringify(e)); 
 
    alert($(e.target).data('index')); 
 
})

.remove_link { 
 
    color: red; 
 
    font-size: 0.8em; 
 
    cursor: pointer; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<button id="add">Add row</button> 
 
<div id="container"></div>

進一步的細節參考difference b/w $(this) ans event.target.

來源

2017-07-06 17:24:27

我沒有看到其他地方，你應該使用'click事件的target'屬性。但是當我打印出事件細節時（使用'JSON.stringify'），'target'顯示爲一個空對象，所以我認爲它不起作用。：/ – CJG

在事件處理程序，this代表窗口。您有權訪問e.target以獲取點擊元素。

這應該工作：

$('#container').on('click', '.remove_link', (e) => { 
    alert($(e.target).data('index')); 
})

來源

2017-07-06 17:24:42 flocks

訪問動態生成的元素

回答

相關問題