ajax请求后刷新div,通过ajax刷新div后,事件监听器不再起作用

这是重新加载按钮,它浮动在页面底部,它不包含在div#main-content中,点击后会刷新:

以下脚本将触发#main-content:的div重新加载

$(document).on("click", '#reload-maincontent', reloadMaincontentCollectorsPage);

function reloadMaincontentCollectorsPage() {

var reloadContent = location.href + " #main--content";

$("#main--content").css( "opacity","0" );

setTimeout(function() {

$("#main--content").load(reloadContent)

.css( "opacity","1" );

}, 600);

$(this).removeClass('toggleInfo');

};

如果我单击按钮重新加载div,它可以正常工作,但刷新的div中的事件监听器不再工作。在单击按钮后刷新div:

add add a can

...

这种结构有很多,它们显示的是来自数据库的不同图片。当我点击#add-cans div时,以下脚本应该启动,但在刷新后它不再起作用了:

$(document).on('click', '[data-catid]', getCanaddInformation);

function getCanaddInformation() {

var catid = $(this).data("catid");

var catName = $(this).data("cadd-catname");

var catCount = $(this).data("cadd-currcans");

$('#get-catname-uploader').text(catName);

$('#addcan-catid').val(catid);

}

脚本包含在jQuery下的head标记中。