Question

我想使用jQuery选择并显示图像我在click div上尝试tile_details并使用jQuery在tile__media中显示col-md-6图片。

<div class="tile">
  <div class="tile__media">
    <img class="tile__img" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/70390/show-18.jpg" alt="" />
  </div>
  <div class="tile__details">
    <div class="tile__title">
      Top Gear
    </div>
  </div>
</div>


<div class="container-fluid" style="display:none">
  <div class="row">
    <div class="col-md-6">
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque eveniet reprehenderit, consequatur perferendis repellendus omnis libero laboriosam nostrum tenetur nulla dolores quos id delectus quo obcaecati eaque provident? Maxime, atque. Lorem ipsum
      dolor sit amet, consectetur adipisicing elit. Itaque eveniet reprehenderit, consequatur perferendis repellendus omnis libero laboriosam nostrum tenetur nulla dolores quos id delectus quo obcaecati eaque provident? Maxime, atque. Lorem ipsum dolor
      sit amet, consectetur adipisicing elit. Itaque eveniet reprehenderit, consequatur perferendis repellendus omnis libero laboriosam nostrum tenetur nulla dolores quos id delectus quo obcaecati eaque provident? Maxime, atque. Lorem ipsum dolor sit
      amet, consectetur adipisicing elit. Itaque eveniet reprehenderit, consequatur perferendis repellendus omnis libero laboriosam nostrum tenetur nulla dolores quos id delectus quo obcaecati eaque provident? Maxime, atque. Lorem ipsum dolor sit amet,
      consectetur adipisicing elit. Itaque eveniet reprehenderit, consequatur perferendis repellendus omnis libero laboriosam nostrum tenetur nulla dolores quos id delectus quo obcaecati eaque provident? Maxime, atque.
    </div>
    <div class="col-md-6">
      //Display Image
    </div>
  </div>
</div>

Answer 1

如果我正确理解了这个问题，你想要从＆amp; tile}媒体中获取图片。 div并将其设置为该div的内容。如果你给div一个标识符，这可以通过以下jQuery来实现：

$(".tile__details").click(function(e) {
    $('#imageDiv').html($('.tile__media').html());
});

jsFiddle

更新：如果您希望它是动态的，根据您单击的图像，您可以克隆单击到div中的图像。代码如下：

$(".tile__img").click(function(e) {
    $('#imageDiv').html($(this).clone());
});

jsFiddle

如何使用jQuery在另一个元素的元素中显示图像

1 个答案: