0
私は動的にメインのdivにイメージを追加し、それらに "カード"のクラスを与えようとしています。私はいくつかの方法を試しましたが、要素を調べるときにクラスを追加するようなことはありません。jqueryは追加されたイメージにクラスを追加します
collection.forEach(function(pack){
pack.forEach(function(info){
if (info.golden === true){
$('.main').append('<img src="' + info.imgGold + '"></img>');
} else {
$('.main').append('<img src="' + info.img + '"></img>');
}
});
$('img').addClass('card');
$('.main').append('<hr></hr>');
});
を私も試してみました：
collection.forEach(function(pack){
pack.forEach(function(info){
var image;
var img = $('<img src="' + image + '"></img>');
if (info.golden === true){
image = info.imgGold;
img.appendTo('.main').addClass('card');
} else {
image = info.img;
img.appendTo('.main').addClass('card');
}
});
$('.main').append('<hr></hr>');
});`
私も試してみました：
$('.main').append('<img class="card" src="' + info.img + '"></img>');
$('.main).append($("<div/>",{
html : "<img src='" + image + "'/>",
class : 'card'
}));
私も
.attr('class', 'card');
は、私が試したのです
CSS：
.card{
cursor: pointer;
height: 200px;
}
.card:hover{
opacity: 0.8;
}
HTML：助けるため
<html>
<body>
<header>
<h1>Hearthstone Pack Simulator</h1>
<form>
<select name="sets" id="sets">
<option value="Classic">Classic</option>
<option value="Goblins vs Gnomes">Goblins vs Gnomes</option>
<option value="Journey to Un'Goro">Journey to Un'Goro</option>
<option value="Mean Streets of Gadgetzan">Mean Streets of Gadgetzan</option>
<option value="The Grand Tournament">The Grand Tournament</option>
<option value="Whispers of the Old Gods">Whispers of the Old Gods</option>
</select>
<select name="no of packs" id="nop">
<option value="1">1</option>
<option value="2">2 - $2.99</option>
<option value="7">7 - $9.99</option>
<option value="15">15 - $19.99</option>
<option value="40">40 - $49.99</option>
</select>
<input type="submit" id="submit">
<input type="submit" id="reset" value="Reset">
</form>
</header>
<div class="tab_a">
<h3>Collection</h3>
</div>
<div class="tab_b">
<h3>Current Packs</h3>
</div>
<div class="tab_c">
<h3>Extra Cards</h3>
</div>
<div class="data">
</div>
<div class="main">
</div>
<div id="myModal" class="modal">
<span class="close" onclick="document.getElementById('myModal').style.display='none'">×</span>
<img class="modal-content" id="img01">
<div id="caption"></div>
</div>
</body>
</html>
感謝。
問題はどうなりますか？それが追加されたことを確認しましたか？ – Omi
クラスが画像に適用されていないかどうかを検査します。 – lowercanada
コンソールエラー？あなたのコードは正しいです。クラスカードに関連する機能がありませんでした – Omi