JavaScript圖片選擇：避免一次又一次

這是代碼選擇相同的圖像：JavaScript圖片選擇：避免一次又一次

<script type="text/javascript"> 
function checked(id) { 
    $('#'+id).css("opacity","0.3"); 
    $("#check").clone().appendTo('#'+id); 
    $("#check").css('display','block'); 
    $("#check").css('margin','-125px 0 0 75px'); 
    $('#'+id).css('margin','0 0 0 -1px'); 
} 
</script>

HTML代碼：

<div class="row-fluid"> 
    <div class="span3 mar_b"> 
     <a href="javascript:" onClick="checked('img1')" id="img1" class="img1"><img src="images/1.jpg" alt="img" /></a> 
    </div> 
    <div class="span3 mar_b"> 
     <a href="javascript:" onClick="checked('img2')" id="img2"><img src="images/2.jpg" alt="img" /></a> 
    </div> 
    <div class="span3 mar_b"> 
     <a href="javascript:" onClick="checked('img3')" id="img3"><img src="images/silverfish.jpg" alt="img" /></a> 
    </div> 
    <div class="span3 mar_b"> 
     <a href="javascript:" onClick="checked('img4')" id="img4"><img src="images/4.jpg" alt="img" /></a> 
    </div> 
</div>

請給我建議。

當我點擊圖像時，它是完美的選擇，但如果我再次點擊它，那麼它會一次又一次地被選中。

如果有其他建議，請另外提供.... 謝謝。

來源

2013-06-29 kds7ap

我想指標圖片是否被選中是否有$("#check")。如果是這樣，在您的代碼中，我看不到您取消選擇圖像的位置（刪除$("#check")）。它總是增加越來越多。更新您這樣的代碼（記得一類check分配給您的#check因爲我們將使用這個類來尋找克隆）

function checked(id) { 
    $('#'+id).css("opacity","0.3"); 
    if ($('#'+id).find(".check").length == 0){ 
     $("#check").clone().appendTo('#'+id); 
     $("#check").css('display','block'); 
     $("#check").css('margin','-125px 0 0 75px'); 
    } 
    else { 
     $('#'+id).find(".check").remove(); 
    } 
    $('#'+id).css('margin','0 0 0 -1px'); 
}

當你點擊，它會來回切換選中和未選中狀態

之間

來源

2013-06-29 09:12:46

$（ '＃' + id）的.find（「＃檢查」），刪除（）; $（'＃'+ id）.css（「opacity」，「1」）; – kds7ap

@ user2534272：你應該指定一個類，並使用它來避免重複ID –

試試這個：

<script type="text/javascript"> 
var prevID=""; 
function checked(id) { 
    if(id!=prevID) 
    { 
     $('#'+id).css("opacity","0.3"); 
     $("#check").clone().appendTo('#'+id); 
     $("#check").css('display','block'); 
     $("#check").css('margin','-125px 0 0 75px'); 
     $('#'+id).css('margin','0 0 0 -1px'); 
     prevID=id; 
    } 
} 
</script>

來源

2013-06-29 09:13:31 Bhushan

你的答案也是對的，但如果我們再次點擊它應該刪除選擇。謝謝哥們。 – kds7ap

@ kds7ap不用客氣 – Bhushan

我猜你嘗試實現切換操作。所以你應該檢查它是否被檢查，然後先取消選中而不是檢查它。在這裏你想達到什麼。。 Fiddler Demo

 .... 

     if($this.hasClass("selected")) { 
      $this 
       .removeClass("selected") 
       .find(".check") 
       .remove(); 
     } 
     else { 
      $this 
       .addClass("selected") 
       .find(".check") 
       .remove(); 
      ....

來源

2013-06-29 10:10:15

JavaScript圖片選擇：避免一次又一次

回答

相關問題