Heim  >  Artikel  >  Web-Frontend  >  So verhindern Sie das Sprudeln von JS und das Standardverhalten des Browsers

So verhindern Sie das Sprudeln von JS und das Standardverhalten des Browsers

php中世界最好的语言
php中世界最好的语言Original
2018-03-16 10:25:131455Durchsuche

Dieses Mal zeige ich Ihnen, wie Sie das Sprudeln von JS und das Standardverhalten des Browsers verhindern können. Was sind die Vorsichtsmaßnahmen, um das Sprudeln von JS und das Standardverhalten des Browsers zu verhindern? ist ein praktischer Fall.

Ereigniskompatibilität:

function myfn(e){ var evt = e ? e:window.event;🎜>

js stoppt das Sprudeln von Ereignissen

function myfn(e){
window.event? window.event.cancelBubble = true : e.stopPropagation();
}
js verhindert Standardverhalten

function myfn(e){
window.event? window.event.returnValue = false : e.preventDefault();
}
Im Folgenden finden Sie detaillierte Anweisungen zu

JavaScriptSprudeln stoppen und Standardverhalten verhindern

Blasen verhindern

Die Methode von w3c ist e.stopPropagation(), und IE verwendet e.cancelBubble = true

stopPropagation ist auch eine Methode des Ereignisobjekts (Event). Seine Funktion besteht darin, das Blasenereignis des Zielelements zu verhindern Das Standardverhalten wird nicht blockiert. Was ist ein sprudelndes Ereignis? Wenn ein „Klick“-Ereignis an eine Schaltfläche gebunden ist, wird das „Klick“-Ereignis wiederum in seinem übergeordneten Element ausgelöst. stopPropagation verhindert, dass Ereignisse vom Zielelement zum übergeordneten Element gelangen. Zum Beispiel:

<div id=&#39;div&#39; onclick=&#39;alert("div");&#39;>
<ul onclick=&#39;alert("ul");&#39;>
<li onclick=&#39;alert("li");&#39;>test</li>
</ul>
</div>
Der obige Code, die Demo lautet wie folgt: Wenn wir auf Test klicken, werden Alert("li"), Alert("ul"), Alert("div") ausgelöst Nacheinander sprudeln die Ereignisse in die Luft.

Blasenbildung verhindern

window.event? window.event.cancelBubble = true : e.stopPropagation();
Standardverhalten verhindern

Die w3c-Methode ist e.preventDefault() und IE verwendet e.returnValue = false;

preventDefault ist eine Methode des Ereignisobjekts (Event) und ihre Funktion besteht darin, das Standardverhalten eines Zielelements abzubrechen. Da es sich um ein Standardverhalten handelt, muss das Element natürlich ein Standardverhalten haben, bevor es abgebrochen werden kann. Wenn das Element selbst kein Standardverhalten hat, ist der Aufruf natürlich ungültig. Welche Elemente haben Standardverhalten? Zum Beispiel Link , Senden-Schaltfläche usw. Wenn cancelable des Ereignisobjekts „false“ ist, bedeutet dies, dass es kein Standardverhalten gibt. Auch wenn es ein Standardverhalten gibt, funktioniert der Aufruf von „preventDefault“ nicht.

Wir alle wissen, dass die Standardaktion von Link
darin besteht, zur angegebenen Seite zu springen:

//假定有链接<a href="http://caibaojian.com/" id="testA" >caibaojian.com</a>
var a = document.getElementById("testA");
a.onclick =function(e){
if(e.preventDefault){
e.preventDefault();
}else{
window.event.returnValue == false;
}
}
gibt false zurück

Die Rückgabe von „false“ durch Javascript verhindert nur das Standardverhalten, aber die Verwendung von jQuery verhindert sowohl das Standardverhalten als auch das Blubbern von Objekten

Im Folgenden wird natives JS verwendet, das nur das Standardverhalten verhindert , nicht Hören Sie auf zu sprudeln

<div id=&#39;div&#39;  onclick=&#39;alert("div");&#39;>
<ul  onclick=&#39;alert("ul");&#39;>
<li id=&#39;ul-a&#39; onclick=&#39;alert("li");&#39;><a href="http://caibaojian.com/"id="testB">caibaojian.com</a></li>
</ul>
</div>
var a = document.getElementById("testB");
a.onclick = function(){
return false;
};
Im Folgenden wird jQuery verwendet, um sowohl das Standardverhalten zu verhindern als auch das Sprudeln zu stoppen

<div id=&#39;div&#39;  onclick=&#39;alert("div");&#39;>
<ul  onclick=&#39;alert("ul");&#39;>
<li id=&#39;ul-a&#39; onclick=&#39;alert("li");&#39;><a href="http://caibaojian.com/"id="testC">caibaojian.com</a></li>
</ul>
</div>
$("#testC").on('click',function(){
return false;
});
Zusammenfassung der Verwendung

Wenn Sie Sie müssen das Blasenverhalten stoppen. Wenn Sie das Standardverhalten verhindern müssen, können Sie

function stopBubble(e) { 
//如果提供了事件对象,则这是一个非IE浏览器 
if ( e && e.stopPropagation ) 
    //因此它支持W3C的stopPropagation()方法 
    e.stopPropagation(); 
else 
    //否则,我们需要使用IE的方式来取消事件冒泡 
    window.event.cancelBubble = true; 
}
Ereignis-Aufmerksamkeitspunkte

Ereignis verwenden, um den Status des Ereignisses darzustellen, z. B. das Auslösen des Ereignisobjekts Elemente, Mausposition und -status, gedrückte Tasten usw.;
//阻止浏览器的默认行为 
function stopDefault( e ) { 
    //阻止默认浏览器动作(W3C) 
    if ( e && e.preventDefault ) 
        e.preventDefault(); 
    //IE中阻止函数器默认动作的方式 
    else 
        window.event.returnValue = false; 
    return false; 
}

Ereignisobjekt ist nur während des Ereignisses gültig.

Ereignisse in Firefox unterscheiden sich von denen im IE. Die Ereignisse im IE sind globale Variablen und können jederzeit verwendet werden. Die Ereignisse im Firefox können nur durch Parameterführung verwendet werden und sind temporäre Variablen zur Laufzeit.

Im IE/Opera ist es window.event, in Firefox ist es event und das Objekt des Ereignisses ist window.event.srcElement im IE, in Firefox ist es event.target, beide sind in Opera verfügbar.

Die folgenden zwei Sätze haben die gleiche Wirkung:


Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln Artikel auf der chinesischen PHP-Website!

Empfohlene Lektüre:
function a(e){
var e = (e) ? e : ((window.event) ? window.event : null); 
var e = e || window.event; // firefox下window.event为null, IE下event为null

Die API, die jQuery beherrschen muss

ajas asynchrones Upload-Plug-in

jQuery implementiert die Formularüberprüfung nach der mehrschichtigen Überprüfung

Das obige ist der detaillierte Inhalt vonSo verhindern Sie das Sprudeln von JS und das Standardverhalten des Browsers. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn