Question

我已经阅读了类似问题的3个答案，但我无法将它们应用到我的网站上。我正在通过ajax加载html页面。我知道我不能在document.ready期间应用$（“a”）。click（）事件，因为dom中还没有ajax内容链接。我想过尝试在$ .get响应中添加事件，但在$ .get中添加$ .get似乎是疯狂的。我尝试使用$（document）.on（'click'，'a'，fn（））也无效。

$(document).ready(function() {

    $(document).on('click', 'a', function(e) {
      e.preventDefault();
      $.get($(this).attr("href"), function(data) {
        $("#mainSection").html(data);
      });
      return false;
    });
});

mainSection是index.html上的div id（与此代码运行的位置相同）。所有链接都处理好像通常点击一样，没有脚本错误。

Answer 1

代码中没有明显的错误。您的脚本位置错误，或者您在另一侧或其他方面有错误。

工作示例：

var content = $('.content');
var newAnchor = function() {
	content.append('<p><a href="https://google.com">' +  new Date().getTime() + '</a></p>')
}
$('button').on('click', newAnchor);
$(document).on('click', 'a', function(e) {
	e.preventDefault();
    alert('No-no!');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="content"></div>
<button>Add new anchor</button>

我建议您将此脚本置于动态内容区#mainSection之外。

阻止$（document）.on（单击）默认事件，然后向Ajax HTML内容添加新事件

1 个答案: