Laravel发布和评论，我在使用ajax创建新帖子后无法发表评论

Question

当我使用浏览器刷新页面时一切正常，我仍然可以评论，我也可以添加新帖子，但问题是当我创建一个新帖子（这意味着像Facebook帖子的帖子）我不能再评论了在任何帖子上。这是我的主页：

<div class="All-Post-Display" id="PostRefresh">
		<div class="container">
		@foreach($latest as $late)
			<div class="row">
				<div class="col-md-5 col-md-offset-2">
					<div class="outside-pannel">
						<div class="person">
							<img src="/styleimage/facebook.jpg">
							<h2>{{$late->user->name}} {{$late->user->lastname}}</h2><br>
							<h4>{{$late->created_at->diffForHumans()}}</h4>
						</div>
						<div class="body-of-post">
							<p>{{$late->body}}</p>
						</div>
						<div class="like-comment-share">
							<form>
								<ul>
									<li><a href="#"><i class="fa fa-thumbs-up"></i>Like</a></li>
									<li><a href="#"><i class="fa fa-comments-o"></i>Comment</a></li>
									<li><a href="#"><i class="fa fa-share"></i>Share</a></li>
								</ul>
							</form>
						</div>
						<div class="comment-section" >
							<div class="total-likes">
									<a href=""><h3>3 likes your post</h3></a>
							</div>
							<div class="comment-form">
							@foreach($late->comments as $comment)
								<div class="display-comments">
									<div class="comment-img">
										<img src="/styleimage/facebook.jpg">
									</div>
									<div class="comment-container">
										<div class="comment-content">
											<a name="postername" href="#">rd</a> <span></span>
											<div class="reply-like">
												<ul>
													<li><a href="">Like</a></li>
													<li><a href="">Reply</a></li>
													<li><h6>just now</h6></li>
												</ul>
											</div>
										</div>
									</div>
								</div>
							@endforeach
								<div>
									<div class="commenting-container">
									<img src="/styleimage/facebook.jpg">
									<textarea rows="1" id="comment-body{{$late->id}}" name="body" placeholder="Write a comment..."></textarea>
									<input type="text" name="commentable" id="posting-id{{$late->id}}" value="{{$late->id}}" style="display: none;">
										<div class="emojis">
											<ul>
												<li><a href="#"><i class="fa fa-smile-o"></i></a></li>
												<li><a href="#"><i class="fa fa-camera-retro"></i></a></li>
												<li><a href="#"><i class="fa fa-bookmark"></i></a></li>
											</ul>
										</div>
									</div>
										
									
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<script>
				$( document ).ready(function() {
				    $('#comment-body{{$late->id}}').keypress(function (e) {
				    	if (e.which == 13) {
				    	    var comment = $('#comment-body{{$late->id}}').val();
				    	    var postCommentedId = $('#posting-id{{$late->id}}').val();
				    	    $.ajax({
				    	    		url: '/comment',
				    	    		type: 'post',
				    	    		data: {'commentable_id':postCommentedId,'body':comment,'_token':$('input[name=_token]').val()},
				    	    		success: function (data) {
				    	    			console.log('success');
				    	    			$('#comment-body{{$late->id}}').val(null);

				    	    		},
				    	    		error: function(XMLHttpRequest, textStatus, errorThrown) {
				    	    		     console.log('errorThrown');
				    	    		  }
				    	    });
				    	}
				      	
				    });
				});
			</script>
		@endforeach
		</div>
	</div>
</div>
{{csrf_field()}}
<script>
$( document ).ready(function() {
     $('#ButtonPost').click(function (event) {
     	var thebody = $('#bodyPost').val();
     	$.ajax({
     			url: 'index',
     			type: 'post',
     			data: {'body':thebody,'_token':$('input[name=_token]').val()},
     			success: function (data) {
     				$('#PostRefresh').load(location.href + ' #PostRefresh');
     				$('#bodyPost').val(null);
     			}
     		});
     });
 	});


</script>

在底部运行这个AJAX后，我的@foreach中的AJAX不起作用，id =“PostRefresh”会在我发布新帖子时刷新。即时通讯也使用id =“{{id of post}}”来使每个帖子都有其独特性，请帮助谢谢...

Answer 1

而不是这个

$('#ButtonPost').click(function (event) ... 

尝试使用

$(document).on('click','#ButtonPost',(function (event) ...

问题在于，一旦你创建了新的DOM，你就不会为你的jquery id创建新元素的id。 但是使用此代码，您将获得与#buttonPost的每个元素链接的jquery代码。