[英]I want to traverse across the DOM , I am not able to access the data
Here is my html code in which I'm trying to traverse through DOM, basically wahen I click edit link I want to be able to traverse back to {{ $post->body }} to access content it has. 这是我尝试遍历DOM的html代码,基本上,当我单击编辑链接时,我希望能够遍历回到{{$ post-> body}}来访问其具有的内容。
<div class="well imagess">
<div class="row">
<div class="col-md-1 col-sm-1 col-xs-1 col-lg-1 col-md-offset-0 col-sm-offset-0 col-lg-offset-0 col-xs-offset-0 ">
<img src="images/female.png" style="height: 70px; width: 70px;">
</div>
<div class="col-md-10 col-sm-10 col-xs-10 col-lg-10 col-md-offset-1 col-sm-offset-1 col-xs-offset-1 col-lg-offset-1" style="margin-top: -15px;">
<h5>{{ $post->title }}</h5>
<br>
<p style="margin-top: -15px;">Posted by - <b>{{ $post->user->first_name }} {{ $post->user->last_name }}</b> from <b>{{ $post->user->city }}, {{ $post->user->country }}</b></p>{{ $post->created_at }}
</div>
</div>
<hr>
<div class="row first">
<div class="col-md-12 col-lg-12 col-sm-12 col-xs-12" id="second">
<p style="font-size: 15px;" id="post-body-edit">{{ $post->body }} </p>
</div>
</div>
<div class="well wellcolor1">
<div class="col-xs-2 col-sm-2">
<a href="g1" style="margin-right: 70px;" title="Like"><span style="color: blue;" class="glyphicon glyphicon-thumbs-up" aria-hidden="true"></span></a>
</div>
<div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 ">
<a href="g2" style="margin-right: 400px;" title="Dislike"><span style="color: blue;" class="glyphicon glyphicon-thumbs-down" aria-hidden="true"></span></a>
</div>
@if(Auth::user() == $post->user)
<div class="col-xs-2 col-sm-2 col-lg-2 col-md-2 col-sm-offset-3 col-xs-offset-3 col-lg-offset-3 col-md-offset-3 edit-class">
<a style="margin-right: 70px;" id="edit" href="#" title="Edit"><span style="color: green;" class="glyphicon glyphicon-pencil" aria-hidden="true"></span></a>
</div>
<div class="col-xs-2 col-sm-2 col-lg-2 col-md-2">
<a href="{{ route('posts.delete', ['id' => $post->id]) }}" title="Delete"><span style="color: red;" class="glyphicon glyphicon-trash" aria-hidden="true"></span></a>
</div>
@endif
<br>
<div class="3">
<a href="#" class="btn btn-default" style="margin-top: 20px;" role="button">Comments</a>
</div>
</div>
and then javascript code 然后是JavaScript代码
$('.wellcolor1').find('.edit-class').find('#edit').on('click', function(event){
event.preventDefault();
var postBody = event.target.parentNode.parentNode.previousSibling.firstChild.childNodes[1].textContent;
$('#post-body').val(postBody);
$('#edit-modal').modal();
});
I want to get {{ $post->body }} content into the modal, my main concern is to get how we traverse across the dom... 我想让{{$ post-> body}}内容进入模式,我主要关心的是如何穿越dom ...
I'm going to go out on a limb here and guess you mean traverse up the DOM. 我将在这里走出去,猜测您的意思是遍历DOM。 In which case, use: https://api.jquery.com/closest/ 在这种情况下,请使用: https : //api.jquery.com/closest/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.