[英]Add event to Added dynamic DOM button - jQuery
我已經閱讀了幾乎所有可用的主題。 他們中的大多數人都重復使用“您應該編寫.on('click'function(){}),它可以解決您的問題。因此-我動態添加了按鈕,並且為該按鈕定義了一個事件。我-單擊按鈕->在重定向之前,將頁面重定向到末尾帶有問號的相同URL-> localhost:3000 / blabla / bla ?,它會更改值,然后刪除按鈕的DOM容器,重定向我嘗試了各種定義位置-首先在文檔准備功能中,
然后在靜態包裝器中准備好
然后在准備好文檔的靜態包裝器中
等等...
另外,我試圖做一個外部功能。
<script>
$(function(){
$('#new-order').on('click',function(e) {
$('#bottom').slideToggle(1000);
});
// btn-delete-item event
// btn-increase event
$('#items').on('click','.btn-increase',function(){
console.log("HEY")
quantityLabel = $(this).parent().find('#line-item-quantity');
addedQntty = parseInt(quantityLabel.text())+1;
quantityLabel.text(addedQntty);
console.log('added quantity')
});
// btn-decrease event
// btn-add-item event
$('.btn-add-item').on('click',function(){
var prodID,quantity,html,itemID,itemTitle,itemPrice,itemDOM,prodPrice;
prodID = $(this).parent().attr('id');
itemTitle= $(this).parent().find('#title').text();
quantity = $(this).parent().find('input').val();
prodPrice= $(this).parent().find('#price').text();
itemPrice = parseInt(quantity)*parseInt(prodPrice);
itemDOM = $('#items').children();
itemDOM.length>0 ? itemID=itemDOM.last().attr('id').slice(-1) : itemID = 0;
html = `<div id="line-item-${itemID}">Title:<label id="line-item-name">${itemTitle}</label>Price:<label id="line-item-price">${itemPrice}</label>quantity<label id="line-item-quantity">${quantity}</label><button class="btn-decrease">-</button><button class="btn-increase">+</button><button class="btn-delete-item">delete</button></div>`;
$('#items').append($(html));
});
});
</script>
希望我盡可能明確地提出這個問題。
<button>
默認類型為“提交”
因此,要使用表單中的按鈕進行除提交使用之外的其他操作
<button type="button">
聽起來您由於瀏覽器表單提交而導致頁面重新加載
在添加項目按鈕的點擊功能上,您嘗試附加$(html)
,只需修復此問題然后再試一次,像這樣寫
$('#items').append(html);
您聲明了一個變量“ html”,並在代碼中嘗試附加整個html。 希望修復它。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.