我的工作代码中有三个部分：
- 一个 PHP 文件，
- 一个jQuery代码部分，其中包含一个AJAX函数，该函数请求，
- 另一个 PHP 文件。
响应是一个 HTML 部分，应该附加到第一个 PHP 文件中的 DIV 前面(从 PHP 文件的<head>部分中使用<script>标记中的 jQuery 部分请求 AJAX。
我的查询是，当 AJAX 在所需的 DIV 元素id="content"中成功动态预置 HTML 时，以响应 HTML 元素标签为目标的其他点击事件不是动态工作的。
可能是什么原因？
$(".update_button").click(function (){
var updateval = $("#update").val();
var cate = $("#selectcategory").val();
var up = $("#uploadvalues").val();
if (up)
{
var uploadvalues = $("#uploadvalues").val();
}
else
{
var uploadvalues = $(".preview:last").attr('id');
}
var X = $('.preview').attr('id');
if (X)
{
var Z = X + ',' + uploadvalues;
}
else
{
var Z = 0;
}
var dataString = 'update=' + updateval + '&Category=' + cate + '&uploads=' + Z;
if ($.trim(updateval).length == 0 || $("#selectcategory").val() === "")
{
if ($.trim(updateval).length == 0)
{
alert('Please Enter SOME TEXT!');
}
else if ($("#selectcategory").val() === "")
{
alert('Choose a Category from the list!');
}
}
else
{
$.ajax({
type: "POST",
url: $.base_url + "message_ajax.php",
data: dataString,
cache: false,
success: function (html)
{
$("#flash").fadeOut('slow');
$(".teacherpost").prepend(html);
$("#update").val('').focus();
$("#selectcategory").val('');
$('#preview').html('');
$('#uploadvalues').val('');
$('#photoimg').val('');
$(".decoration").hide();
}
});
}
return false;
});
HTML 前缀自 AJAX resposne：
<div class="post-description">
<div class="stats">
<div class="st_like_share">
<a class="Like" href="javascript:void(0)" id='like<?php echo $msg_id;?>' title='<?php echo $like_status;?>' rel='<?php echo $like_status;?>' data='<?php echo $shareKey; ?>'><i class="glyphicon glyphicon-star" style="color:#F16522;"></i><?php echo $like_count; ?></a>
<?php } else { ?>
<a class="Like" href="javascript:void(0)" id='like<?php echo $msg_id;?>' title='<?php echo $like_status;?>' rel='<?php echo $like_status;?>' data='<?php echo $shareKey; ?>'><i class="glyphicon glyphicon-star" ></i><?php echo $like_count; ?></a>
<?php } ?>
<a href="javascript:void(0)" class="stat-item remark" data-id="<?php
echo $msg_id;?>" title='Give your Remarks on it'>
<i class="fa fa-comments-o icon"></i><?php echo $remark_count; ?>
</a>
<a href="javascript:void(0)" class="stdelete stat-item" data-id="<?php echo $omsg_id;?>" rel="" title="Delete Post">
</a>
<?php }
?>
</div>
</div>
</div>
<div class="post-footer" id="post-footer-<?php echo $msg_id;?>">
<textarea name="comment" class="form-control add-comment-input" id="ctextarea<?php echo $omsg_id;?>" style="width:100%;" placeholder="Add a remark here..."></textarea>
<span class="input-group-btn">
<input type="submit" value="Remark" name="Remark" id="<?php echo $omsg_id;?>" rel="<?php echo $msg_id;?>" class="btn btn-info pull-right Remark_button">
<!--<input type="submit" id="" value="Send" class="btn btn-default go-chat pull-right ">-->
</span>
<?php if($remark_count>0) { ?>
<ul class="comments-list" id="commentload<?php echo $msg_id;?>">
<?php include('comments_load.php'); ?>
</ul>
<?php } ?>
</div>
</div>
在 AJAX 上不起作用的 jQuery 响应了 HTML 代码：
/*Remark Load */
$(".stat-item.remark").on("click", function( e ) {
var post_footer_id = "#post-footer-"+$(this).data('id');
$(post_footer_id).slideToggle();
});
动态这是不起作用的，但是当我刷新页面时，此jQuery工作正常。
像这样尝试
$(document).on('click', '.stat-item.remark', function(){
var post_footer_id = "#post-footer-"+$(this).data('id');
$(post_footer_id).slideToggle();
});
$.ajax({
type: "POST",
url: $.base_url + "message_ajax.php",
data: dataString,
cache: false
})
.done((data) => {
//on success code here
})
.fail((jqXhr) => {
//on failure code here
//jqXhr.responseJSON
});