暮色呼如
2023-05-18 10:48:31
我正在處理一個表單,其中選擇是動態創建的。所以我這樣做了:function populateSelect() { $.ajax({ type: "GET", url: URLSELECT + 'tipologia', success: function (response) { let key; for (var k in response._embedded) { key=k; break } createSelect(response._embedded[key], "tipologia") let options = $('select[name=tipologia]').find('option'); options.each((el)=>{ $(this).on('click', function(){ console.log($(this)); }) }) }, error: function(err){ console.log(err); } });}function createSelect(options, select) { options.forEach((el)=>{ let text = el.name; let option = document.createElement('option'); option.setAttribute('value', text); option.textContent = text option.addEventListener('click', function(e){ console.log('test); }) document.querySelector(`[name=${select}]`).appendChild(option); })}現在,如果我檢查 HTML,選項將以正確的方式創建,具有正確的值和正確的文本,但 addEventListener 不起作用。
1 回答

慕娘9325324
TA貢獻1783條經驗 獲得超4個贊
首先,該click事件在元素上沒有得到很好的支持option。更好的做法是監聽changeparent 上的事件select,然后讀取 chosen 的值option。
此外,您的代碼比需要的復雜得多。您可以使用和option從 AJAX 請求的響應更輕松地構建元素列表。嘗試這個:map()append()
let $select = $('select[name=tipologia]').on('change', e => {
console.log(e.target.value);
});
function populateSelect() {
$.ajax({
type: "GET",
url: URLSELECT + 'tipologia',
success: function(response) {
let options = response._embedded.map(o => `<option value="${o.name}">${o.name}</option>`);
$select.html(options);
},
error: function(err) {
console.log(err);
}
});
}
添加回答
舉報
0/150
提交
取消