问题

Question

我想点击带有btnGenerate类的div，并且应该将图像添加到具有card1类的div。

HTML

<div class="btnGenerate">
    <p class="generate">Generate team</p>
</div>
<div class="card1"></div>

JS

$(document).ready(function () {
    $('.btnGenerate').click(function () {
        $('.card1').prepend('<img class="card" src="card1">');
    });
});

问题

当我点击.btnGenerate时，它不会向我的.card1添加图片。所以我希望它将我的图像添加到类

Answer 1

你的代码看起来不错。您只需要将src img元素的正确图像路径添加到其中：

＆＃13;

$(document).ready(function () {
    $('.btnGenerate').click(function () {
        $('.card1').prepend('<img class="card" src="http://placehold.it/100x50/ff7878">');
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="btnGenerate">
    <p class="generate">Generate team</p>
</div>
<div class="card1"></div>

＆＃13;

Answer 2

也许只是不添加链接或路径问题的任何扩展例如，运作良好：

＆＃13;

$(document).ready(function() {
  $('.btnGenerate').click(function() {
    $('.card1').prepend('<img class="card" src="http://cdn.sstatic.net/stackoverflow/img/apple-touch-icon.png?v=c78bd457575a">');
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="btnGenerate">
  <p class="generate">Generate team</p>
</div>

<div class="card1"></div>

＆＃13;

用jQuery点击将图片添加到div

问题

2 个答案: