jQuery solves the problem of not executing the original event after adding elements

Let's take a look at my error code first.

html:

        <table border="1" id="best">
			<tr>
				<td>
					<button class="change">Modify</button>
				</td>				
			</tr>
			<tr>
				<td>
					<button class="del">Delete</button>
				</td>				
			</tr>
			<tr class="last"><td><button class="add">Add</button></td></tr>
		</table>

js:

$(".add").click(function(){
		var newYuansu = $("<tr><td><button class='del'>Delete</button></td></tr>");
		$(".last").before(newYuansu);
})
$(".del").click(function(){
        $(this).parents("tr").remove();
})

When you use jQuery to add new elements, the new elements will not execute some of the original event functions.

The blogger is a student and has only studied one method:

$("#best").on("click",".del",function(){
		$(this).parents("tr").remove();
})

Write the original click event like this, and you can use it on the newly added element, which is very useful~

Replenish:

1. For jquery versions below 1.3 (not including jquery 1.3), it is time to update your jquery version.

Because there is no solution no solution no solution no solution

2. If the jquery version is between 1.3-1.8, the solution to the binding event triggered by the dynamically added elements of js/jq (it is not recommended to use the on event, because the on event is not supported below version 1.6 and an error will be reported)

Bind live events (live events are only supported in jquery 1.9 and below, not in higher versions).

$(".del").live("click",function(){ ///jquery 1.9 (excluding 1.9) and below can alert('Here is the event added by dynamic elements');

           })

3. Recommended to use on

If the jQuery version is 1.9 or higher, the live delegate event is removed and implemented through on. Solution to trigger binding events for dynamically added elements in js/jq

Note: If a page contains both a lower version of jq (1.3-1.8) and a higher version of jq (jquery1.9 or above), the live delegate event will be removed by the higher version. As a result, even if the jquery version is between 1.3-1.8 and the live event is used, the page will report an error.

This concludes this article on jQuery's method of solving the problem of not executing original events after adding elements. For more jQuery-related content, please search 123WORDPRESS.COM's previous articles or continue to browse the following related articles. I hope everyone will support 123WORDPRESS.COM in the future!