数据结构
网络
RDBMS
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚学
法学如何在通过 Ajax 返回的动态内容中绑定 jQuery 事件？
若要在动态内容中绑定 jQuery 事件，请使用事件委托。不妨尝试运行以下代码，学习如何在通过 Ajax 返回的动态内容中绑定 jQuery 事件。
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".loadingAjax").on("click", function() {
event.preventDefault();
var url = $(this).attr("href"),
appendedContainer = $(".append");
$.ajax({
url: url,
type : 'get',
complete : function( qXHR, textStatus ) {
if (textStatus === 'success') {
var data = qXHR.responseText
appendedContainer.hide();
appendedContainer.append("<a href='#' class='link'>Hi</a>");
appendedContainer.fadeIn();
}
}
});
});
$(document).on("click", '.link', function(event) {
alert("Link clicked!");
});
});
</script>
<style type="text/css">
a.test { font-weight: bold; }
body { font-family: sans-serif;}
</style>
</head>
<body>
<a class="loadingAjax" href="https://www.qries.com"> Click to load Ajax</a>
<div class="append"></div>
</body>
</html>
更新于：15-6-2020
695 次浏览
广告