Question

我试图通过点击将这个html推送到一个数组

HTML

  <div class="col-xs-12 col-md-6">
   <div class="thumbnail">
     <div class="embed-responsive embed-responsive-16by9">
        <iframe class="embed-responsive-item" src="https://www.youtube.com/embed/V9GsS-aMVNs" frameborder="0" allowfullscreen=""></iframe>
     </div>
    <div class="caption">
      <p>Duration: <span class="video-time">10:35</span></p>
      <button type="button" class="btn btn-danger btn-block btn_video"><strong>ADD</strong></button>
    </div>
   </div>
  </div>

的jQuery

var urls = [];
$('body').on('click', '.btn_video', function() {
  var $myVideo = $(this).parent().parent().wrap('<div class="col-xs-12 col-md-6"/>');
  var $myVideoWrapped = $($myVideo.html());
  console.log($myVideoWrapped.html());
  urls.push($myVideoWrapped.html());
  $('#usp-custom-5').text(urls.join(' '));
});

这让我在控制台：

<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/3BXL9opyOdo" frameborder="0" allowfullscreen=""></iframe>

虽然我会按照上面的方式获得整个HTML

Answer 1

尝试以下方法：

var urls = [];
$('body').on('click', '.btn_video', function() {
  var $myVideo = $(this).parent().parent().parent().prop('outerHTML');
  //console.log($myVideo);
  urls.push($myVideo);
  console.log(urls[0]);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-xs-12 col-md-6">
   <div class="thumbnail">
     <div class="embed-responsive embed-responsive-16by9">
        <iframe class="embed-responsive-item" src="https://www.youtube.com/embed/V9GsS-aMVNs" frameborder="0" allowfullscreen=""></iframe>
     </div>
    <div class="caption">
      <p>Duration: <span class="video-time">10:35</span></p>
      <button type="button" class="btn btn-danger btn-block btn_video"><strong>ADD</strong></button>
    </div>
   </div>
  </div>

如何包装变量并将html推入数组？

1 个答案: