2016-12-12 8 views
0

DOMを通過しようとしている私のHTMLコードはこちらです。リンクをトラバースできるようにしたいコンテンツにアクセスするには{{$ post-> body}}に戻ってください。DOMを横断したい、データにアクセスできない

<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> 

して、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(); 
}); 

私は{{$ポスト>ボディ}}モーダルにコンテンツを取得したい、私の主な関心事は、我々は、DOMを横断方法を取得することです...

+0

ここでDOMトラバースとはどういう意味ですか? –

+2

あなたの質問は不明で、{{$ post-> body}}これはjs構文ではありません。 このリンクを特に参考にして、質問をする方法をよく読んでください。 http://stackoverflow.com/help/mcve –

+0

'post-> body'の親はid(' post-body-edit')を持っています。なぜそれをセレクタとして使用しないのですか? – Turnip

答えて

0

私はここで手足に出て、あなたがDOMを横断することを意味すると思います。その場合は、次のように使用してください:https://api.jquery.com/closest/

関連する問題