jQueryに挿入する画像を取得できません

-2

スノーボタンがクリックされるとプログラムが写真の上にスノーフレーク画像を読み込むようにプログラムを作ろうとしています。何らかの理由でボタンをクリックすることさえできません機能する。助けていただければ幸いです。jQueryに挿入する画像を取得できません

<!doctype html> 
<html> 
<body> 
<button type="button" id ="button1">Snowing</button> 
<button type="button" id ="button2">Stop</button> 
<div id = "div1"><img src="http://static.boredpanda.com/blog/wp-content/uuuploads/winter-landscapes/winter-landscapes-20.jpg"; height="500"; width="700"></img></div> 
<img src="http://www.clipartkid.com/images/204/simple-christmas-snowflake-icon-png-clipart-image-iconbug-com-IFd3i8-clipart.png" id = "sf1" height="50"; width="50;"></img> 
<script src="jquery-3.1.1.min.js"> 
$(document).ready(function(){ 
    $("#button1").click(function(){ 
     $('#div1').prepend($('<img>',{id:'sf1',src:'http://www.clipartkid.com/images/204/simple-christmas-snowflake-icon-png-clipart-image-iconbug-com-IFd3i8-clipart.png'})) 
    }); 
    $("#button2").click(function(){ 

    }); 
} 
</script> 
</body> 
</html>

出典

2017-03-20 kbb5268

あなたにはidが 'theDiv'の要素はありません。あなたは '$（ '＃div1'）'を意味しましたか？ – Phil

また、 –

...または「」タグ – Phil

これがうまくいけば、あなたは正しい方向に軌道に乗る必要があり、あなたのHTMLおよびJavaScriptでのミスがたくさんあります - IDEはあなたのためにこれらを強調表示に役立つかもしれません。

HTML：

<button type="button" id="button1">Snowing</button> 
<button type="button" id="button2">Stop</button> 
<div id="div1"> 
    <img src="http://static.boredpanda.com/blog/wp-content/uuuploads/winter-landscapes/winter-landscapes-20.jpg" height="500" width="700"> 
</div>

JS：

$('#button1').click(function() { 
    $('#div1').prepend('<img src="http://www.clipartkid.com/images/204/simple-christmas-snowflake-icon-png-clipart-image-iconbug-com-IFd3i8-clipart.png">'); 
});

あなたのjavascriptの主な問題は、あなたが.prepend($('<img>'代わりの.prepend('<img>'をしたということです。

フィドル：https://jsfiddle.net/KyleMuir/Lo74o6sh/2/

出典

2017-03-20 00:31:24

あなたの提案を実装しましたが、コードはまだ私の目的のために働いていません。 jQueryを間違って実装しましたか？ – kbb5268

jQueryに挿入する画像を取得できません

答えて

関連する問題