附加新元素后功能不起作用

我对jQuery函数创建的新元素的“点击”操作有问题,它不起作用。

我为此链接创建了一个JSFiddle,但是它不能完美运行,因为我无法在JSFiddle中调用Ajax请求。

我有两个按钮

<input type="button" onclick="invia('SIC-034031','', 's');" value="AGGIUNGI" style="height: 20px; width: 110px; background-color: #A5EFC5 ; color: #000000; font-family: Arial,Helvetica,sans-serif; font-size: 12px; background-repeat: no-repeat; background-position: left center;" id="iscriviSIC-034031" class="pulsanteIscrizioni" name="xaggiorna"/>&nbsp;

<input type="button" onclick="invia('SIC-034031','R', 's');" value="RISERVA" style="height: 20px; width: 110px; background-color: #F00000; color: #FFFFFF; font-family: Arial,Helvetica,sans-serif; font-size: 12px; background-repeat: no-repeat; background-position: left center;" id="iscriviRSIC-034031" class="pulsanteIscrizioni" name="xaggiorna"/>

首次调用ajax函数时,一个按钮会回答以下输出:

OK;I;SIC-034031

按钮二仅用于擦除。按钮一创建。

<input id="iscriviSIC-034031" class="pulsanteIscrizioni" type="button" name="xaggiorna" style="height: 20px; width: 110px; background-color: #03F; color: #FFF; font-family: Arial,Helvetica,sans-serif; font-size: 12px;" value="TOGLI" onclick="invia('SIC-034031','');">

当我单击此新按钮时,ajax函数将返回此按钮,

OK;C;SIC-034031;;

第一个按钮消失,第二个按钮回来。现在存在问题所在,如果我单击第一个按钮,则一切正常。如果我单击第二个按钮,它将不起作用。

您能帮我找到问题吗?

谢谢 ;)

回答:

jQuery仅在运行时知道页面中的元素,因此jQuery无法识别添加到DOM中的新元素。为了避免使用事件委托,将事件从新添加的项目冒泡到jQuery在页面加载时在DOM中的某个点。许多人都将其document用作捕获冒泡事件的地方,但是并没有必要将DOM树放在那儿。理想情况下,您应该委派给页面加载时存在的最接近的父级。

$(".pulsanteIscrizioni").on("click", function()

这就是你现在拥有的。更改为-

$(document).on("click", '.pulsanteIscrizioni',function()

以上是 附加新元素后功能不起作用 的全部内容, 来源链接: utcz.com/qa/399027.html

回到顶部