綁定和取消綁定問題進行其次單擊

jQuery的

$(function() { 
       $("#evtTarget").bind("mouseover",highlighted); 
       $("#evtTarget").bind("mouseleave",highlighted); 

       $("#evtTarget").bind("click",function(){ 
        $("#evtTarget").unbind("mouseover",highlighted); 
        $("#evtTarget").unbind("mouseleave",highlighted); 
        $("#evtTarget").html("Off.Click for On."); 

        }); 
     }); 

     function highlighted(evt){ 
       $("#evtTarget").toggleClass("highlighted"); 
      }

的Html

<h1>Binding Event Example</h1> 
<div id="evtTarget" class="normal">On. Click for Off.</div>

的CSS

normal { 
     width:300px; 
     height:200px; 
     background-color:red; 
     font-size:18pt; 
     color:black; 
    } 
.highlighted { 
     background-color:white; 
}

如果你將鼠標懸停evtTarget ID款highligt 。如果你點擊evtTarget ID突出顯示將關閉。

但我想如果用戶點擊二次突出顯示。

我怎樣才能做到這一點？

來源

2011-09-17 Programmer

笏你的意思是通過二次點擊？其他鼠標按鈕？或者只是第二次點擊？ – joncodo

否。當用戶第一次點擊時，突出顯示處於關閉狀態。但是，如果用戶的第二個什麼都沒有。你明白嗎？ – Programmer

你可以使用.data方法(api)保存是否突出是：

$(function() { 
    $("#evtTarget").bind("mouseover",highlighted) 
     .bind("mouseleave",highlighted) 
     .data("isOn", true); 

    $("#evtTarget").bind("click",function(){ 

     if($(this).data("isOn")) { 
      $("#evtTarget") 
       .unbind("mouseover",highlighted) 
       .unbind("mouseleave",highlighted) 
       .removeClass("highlighted") 
       .html("Off: Click for On.") 
       .data("isOn", false); 

     } else { 
      $("#evtTarget") 
       .bind("mouseover",highlighted) 
       .bind("mouseleave",highlighted) 
       .addClass("highlighted") 
       .html("On: Click for Off.") 
       .data("isOn", true);       
     } 
    }); 
}); 

function highlighted(evt){ 
    $("#evtTarget").toggleClass("highlighted"); 
}

來源

2011-09-17 02:18:08 fsong

嘗試此javascript：

<script type="text/javascript"> 
$(function() { 
    $(".normal").live("mouseover", highlighted); 
    $(".normal").live("mouseleave", highlighted); 

    $("#evtTarget").toggle(
    function() { 
     $(this).toggleClass("normal"); 
     $(this).html("Off.Click for On."); 
    }, 
    function() { 
     $(this).toggleClass("normal"); 
     $(this).html("On. Click for Off."); 
    } 
); 
}); 

function highlighted(evt){ 
    $("#evtTarget").toggleClass("highlighted"); 
} 
</script>

，而不是管理的狀態，你的亮點，能夠手動，讓jQuery的做的工作適合你。如果用戶單擊div，請刪除「normal」類，這將導致mouseover和mouseleave事件無效。如果他們再次點擊，只需恢復「正常」課程。

您可以在live()查看該功能的文檔。

來源

2011-09-17 02:11:48

我不確定您點擊其次的意思。如果你的意思是右鍵點擊（鼠標右鍵），你也想綁定到「rightclick」。如果您的意思是您希望在第二次點擊時再次突出顯示，則您的代碼已經顯示爲突出顯示。如果你只是想更改文本，以及，你會想只是把這樣的事情到您的亮點方法：

if$("#evtTarget").html().indexOf("Off") == 1){ 
    $("#evtTarget").html("On. Click for Off."); 
} else { 
    $("#evtTarget").html("Off. Click for On."); 
}

來源

2011-09-17 02:12:44 dlawrence

綁定和取消綁定問題進行其次單擊

回答

相關問題