1 ドロップの夜明け (Bootstrap) に多数の画像があります。今、1 ドロップの夜明けの値をクリックすると、画像が変更される必要があります。しかし、ドロップドーンの値は動的に変更されるため、すべての画像が同じ id になっています。
私のコードを使用すると、最初の画像のみが切り替わります。つまり、名前 1 または名前 6 をクリックすると、名前 1 の画像のみが切り替わり、別の画像が表示されません。
これが私のコードと jS Fiddle です ( http://jsfiddle.net/tutorialdrive/4n7xR/ )
HTML
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Drop Dawn<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="javascript:void(0);" onclick="fnShowHide(0);"><img src = "http://cdn1.iconfinder.com/data/icons/silk2/tick.png" id="icon_green_tick"/><img src = "http://cdn3.iconfinder.com/data/icons/lynx/22x22/actions/dialog-close.png" style = "display:none;" id="icon_green_tick"/> name 1</a></li>
<li><a href="javascript:void(0);" onclick="fnShowHide(1);"><img src = "http://cdn1.iconfinder.com/data/icons/silk2/tick.png" id="icon_green_tick"/><img src = "http://cdn3.iconfinder.com/data/icons/lynx/22x22/actions/dialog-close.png" style = "display:none;" id="icon_green_tick"/> name 2</a></li>
<li><a href="javascript:void(0);" onclick="fnShowHide(2);"><img src = "http://cdn1.iconfinder.com/data/icons/silk2/tick.png" id="icon_green_tick"/><img src = "http://cdn3.iconfinder.com/data/icons/lynx/22x22/actions/dialog-close.png" style = "display:none;" id="icon_green_tick"/> name 3</a></li>
<li><a href="javascript:void(0);" onclick="fnShowHide(3);"><img src = "http://cdn1.iconfinder.com/data/icons/silk2/tick.png" id="icon_green_tick"/><img src = "http://cdn3.iconfinder.com/data/icons/lynx/22x22/actions/dialog-close.png" style = "display:none;" id="icon_green_tick"/> name 4</a></li>
<li><a href="javascript:void(0);" onclick="fnShowHide(4);"><img src = "http://cdn1.iconfinder.com/data/icons/silk2/tick.png" id="icon_green_tick"/><img src = "http://cdn3.iconfinder.com/data/icons/lynx/22x22/actions/dialog-close.png" style = "display:none;" id="icon_green_tick"/> name 5</a></li>
<li><a href="javascript:void(0);" onclick="fnShowHide(5);"><img src = "http://cdn1.iconfinder.com/data/icons/silk2/tick.png" id="icon_green_tick"/><img src = "http://cdn3.iconfinder.com/data/icons/lynx/22x22/actions/dialog-close.png" style = "display:none;" id="icon_green_tick"/> name 6</a></li>
<li><a href="javascript:void(0);" onclick="fnShowHide(6);"><img src = "http://cdn1.iconfinder.com/data/icons/silk2/tick.png" id="icon_green_tick"/><img src = "http://cdn3.iconfinder.com/data/icons/lynx/22x22/actions/dialog-close.png" style = "display:none;" id="icon_green_tick"/> name 6</a></li>
</ul>
</li>
そして私のJqueryコード
$(".dropdown-toggle").click(function () {
$('#icon_green_tick').toggle();
});
Jquery を使用して ID の配列を作成する方法はありますか?
一度にすべての画像を切り替えたくありません。クリックした場所でのみ画像を切り替えます。つまり、名前 2、名前 6 などです。