属性在控制台中返回null

时间:2018-03-27 11:39:24

标签: javascript jquery post

在控制台中显示时,我的data-postid属性为“null”。这是什么原因?

我想在单击带有模态保存ID的按钮时在控制台中显示data-id

我看不出错误

控制台

<article class="post hentry video" data-postid="{{ $post->id }}">

  <div class="post__author author vcard inline-items">
    <img src="/vendor/img/avatar7-sm.jpg" alt="author">

    <div class="author-date">
      <a class="h6 post__author-name fn" href="#">{{$post->user->firstname}} {{$post->user->surname}}</a> ({{$post->user->username}})
      <div class="post__date">
        <time class="published" datetime="2004-07-24T18:18">
         {{$post->created_at}}
        </time>
      </div>
    </div>
    @if(Auth::user() == $post->user)
    <div class="more"><svg class="olymp-three-dots-icon"><use xlink:href="/vendor/icons/icons.svg#olymp-three-dots-icon"></use></svg>
      <ul class="more-dropdown">

        <li>
          <a href="#">Favorilere Ekle(Yapım Aşamasında)</a>
        </li>
        <li>
          <a href="{{ route('post.delete', ['post_id' => $post->id]) }}">Sil</a>
        </li>

      </ul>
    </div>
    @endif()
  </div>

  <div class="interaction post-additional-info inline-items">

    <p style="width: 100%">{{$post->body }}</p>

    <a href="#" class="post-add-icon inline-items">
      <svg class="olymp-heart-icon"><use xlink:href="/vendor/icons/icons.svg#olymp-heart-icon"></use></svg>
      <span>18</span>
    </a>
    <a href="#" class="post-add-icon inline-items">
      <i class="fas fa-thumbs-down"></i>
      <span>5</span>
    </a>
    <div class="gon">

      @if(Auth::user() == $post->user)
      <button type="button" class="edit but-oni btn btn-primary" data-toggle="modal" data-target="#exampleModal">
                                        Düzenle
                                    </button>
      <a href="{{ route('post.delete', ['post_id' => $post->id]) }}" class="but-oni btn btn-primary">
                                        SİL
                                    </a> @endif
    </div>
    <div class="comments-shared">
      <a href="#" class="post-add-icon inline-items">
        <svg class="olymp-speech-balloon-icon"><use xlink:href="/vendor/icons/icons.svg#olymp-speech-balloon-icon"></use></svg>

        <span>2</span>
      </a>
    </div>

  </div>
</article>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Gönderiyi Düzenle</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <form action="">
          <div class="form-group with-icon label-floating is-empty">
            <label class="ex-label control-label" for="post-body">Gönderiyi Düzenleyin</label>
            <textarea class="ex-text form-control" name="post" id="post-body" rows="5"></textarea>
          </div>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Kapat</button>
        <button type="button" class="btn btn-primary" id="modal-save">Değişiklikleri Kaydet</button>
      </div>
    </div>
  </div>
</div>
<!-- Button trigger modal -->
<script>
  var token = '{{ Session::token() }}';
  var url = ' {{route('
  edit ')}}';
</script>

JS

var postId = 0;

$('.post').find('.interaction').find('.edit').on('click', function(event) {
  event.preventDefault();

  var postBody = event.target.parentNode.parentNode.childNodes[1].textContent;
  postId = event.target.parentNode.parentNode.dataset['postid'];
  $('#post-body').val(postBody);
  $('#exampleModal').modal();
});

$('#modal-save').on('click', function() {
  $.ajax({
      method: 'POST',
      url: url,
      data: {
        body: $('#post-body').val(),
        postId: postId,
        _token: token
      }
    })
    .done(function(msg) {
      console.log(msg['message']);
    });
});

路线

Route::post('/edit', function(\Illuminate\Http\Request $request){ return response()->json(['message' => $request['postId']]); })->name('edit');

1 个答案:

答案 0 :(得分:0)

您可以查看以下代码:

let lineWidth: CGFloat = 4.0 // the width of the white border that you want to set
let imageWidth = self.profileImageView.bounds.width
let imageHeight = self.profileImageView.bounds.height

// make sure width and height are same before drawing a circle
if (imageWidth == imageHeight) {
    let side = imageWidth - lineWidth
    let circularPath = UIBezierPath.init(ovalIn: CGRect(lineWidth / 2, lineWidth / 2, side, side))

    // add a new layer for the white border
    let borderLayer = CAShapeLayer()
    borderLayer.path = circularPath.CGPath
    borderLayer.lineWidth = lineWidth
    borderLayer.strokeColor = UIColor.white.cgColor
    borderLayer.fillColor = UIColor.clear.cgColor
    self.profileImageView.layer.insertSublayer(borderLayer, at: 0)

    // set the circle mask to your profile image view
    let circularMask = CAShapeLayer()
    circularMask.path = circularPath.CGPath
    self.profileImageView.layer.mask = circularMask
}

对我来说很完美。