Anderswo klicken Ereignis?

Question

Ich habe ein onClick-Ereignis, um den Stil zu ändern. Wie kann man den Stil ändern, wenn ein Benutzer irgendwo auf ein Element klickt?

Beide Prototypen und Scriptaculous-Bibliotheken enthalten .. viele der folgenden Antworten funktioniert nicht mit ihnen ... Auch ID eines Elements ist UNDEFINED, so dass es nicht als Referenz in Javascript verwendet werden kann.

Danke, Yan

Answer 1

Ich habe nicht getestet dies in allen Browsern, aber wenn Sie wollen keinen neuen js Rahmen einzuführen, diese Lösung nur mit CSS:

<ul> 
    <li tabindex="1">First</li> 
    <li tabindex="2">Second</li> 
</ul> 

die Eigenschaft tabIndex das li-Element macht fo verwertbar. Und das css:

Dies ist natürlich sehr einfaches Styling, wahrscheinlich wollen Sie es in Klassen oder was auch immer.

Answer 2

würde ich jQuery Live-Event und binden Click-Ereignis verwenden :not selector

Answer 3

Verwendung Wenn ein Element auf sie geklickt wird, es den Fokus erhält. Wenn etwas anderes angeklickt wird, wird verlieren Fokus, Triggerung der onblur Ereignis. Funktioniert möglicherweise nicht für alle Elemente, aber es würde beispielsweise für <input> Elemente funktionieren.

Answer 4

Große Frage! Sie können „Ereignis sprudeln“, verwenden, was bedeutet, dass anstelle des Onclick-Ereignis auf Ihrem Element, Sie einen Event-Handler auf einem höheren Objekt definieren (etwa document oder ein table), und es sagen Sie so etwas wie:

if (event.target === myElement) { 
    changeStyle(); 
} else { 
    changeStyleBack(); 
} 

Mehr hier (und anderswo): http://www.southsearepublic.org/tag/Javascript%20Event%20Bubbling/read

Answer 5

Sie wollen die onblur Veranstaltung: „die onblur Ereignis tritt auf, wenn ein Objekt den Fokus verliert“.

Answer 6

Vielleicht versuchen onclick="function1()" onblur="function2()" oder onfocus="function1()" onblur="function2()" im Tag.

Answer 7

Hier ist, wie Sie es in jQuery tun könnten:

$(document).click(function(e) { 
    if ($(e.target).is("#specialItem")) { 
    $(e.target).addClass("specialClass"); 
    } else { 
    $(#specialItem").removeClass("specialClass"); 
    } 
}); 

Wenn Sie nicht jQuery verwenden, können Sie immer noch das Grundmodell verwenden - die Onclick-Ereignis Logik auf Dokumentebene anzuwenden. Dies funktioniert bei Objekten, die nicht auf das Blur-Ereignis reagieren.

Answer 8

Sie können ein onClick-Ereignis an die body binden und die Funktion zuweisen, die den Stil für dieses Ereignis wiederherstellt.

Es gibt ein anschauliches Beispiel bei http://jsbin.com/oxobi3

Answer 9

Es ist schon eine recht lange Zeit, seit ich Prototyp verwendet habe, aber ich hoffe, dass dies hilft Ihnen (im nicht-jQuery Sinne.)

$(window).observe('click', respondToClick); 

function respondToClick(event) { 
var element = event.element(); 
if(!($(this) == element)){ 
    element.addClassName('active');//or do your stuff here 
} 


} 

Answer 10

Mein Ansatz

var elsewhere = 1; 
$(myelement).bind('hoverin',function(){ 
    elsewhere = 0; 
}); 
$(myelement).bind('hoverout',function(){ 
    elsewhere = 1; 
}); 

$('screenarea').click(function(){ 
    if(elsewhere){ 
     change-style-back(); 
    } else{ 
     change-style(); 
    } 
}); 

das dafür sorgen wird, dass, wenn Sie irgendwo auf dem Bildschirm klicken und die nicht auf Ihrem Element, dann wird der Stil