Heim Backend-Entwicklung PHP-Tutorial jQuery implementiert das Effektbeispiel für die Ein- und Ausblendfunktion von IE6

jQuery implementiert das Effektbeispiel für die Ein- und Ausblendfunktion von IE6

Feb 05, 2018 pm 01:28 PM
ie jquery 提示

In diesem Artikel wird hauptsächlich die Implementierung der mit IE6 kompatiblen Ein- und Ausblendeffekt-Warnungsaufforderungsfunktion in jQuery vorgestellt. Er analysiert die spezifischen Implementierungsschritte und zugehörigen Betriebstechniken der jQuery-Popup-Warnungsaufforderungsfunktion in Form von Konkrete Beispiele. Freunde, die es brauchen, können sich darauf beziehen. Ich hoffe, es kann allen helfen.

Eigentlich denke ich, dass es am besten ist, einen Alert direkt für Alarmaufforderungen zu verwenden. Kommen Sie direkt auf den Punkt und lassen Sie die Benutzer die Bedeutung Ihres aktuellen Systems verstehen. Der Schlüssel ist, dass Alert mit jedem Browser kompatibel sein muss, egal wie kaputt er ist. Andernfalls werden Sie ein dummer Browser sein. Heutzutage gelten Warnungen jedoch zunehmend als unansehnlich und es gibt den Trend, dass „Popup-Fenster beängstigend sind“. Deshalb müssen Sie Warnungen besser aussehen lassen. Unter der Voraussetzung, dass es schwierig ist, die Transparenz von Javascript zu steuern, ist der einfache Fade-Effekt von jQuery Ihre Wahl. Der Grund, warum ich mich für jQuery entschieden habe, ist, dass es gut mit IE6 kompatibel ist.

1. Grundziel

Wenn die Anzahl der Zeichen im Eingabefeld sowohl auf Chinesisch als auch auf Englisch mehr als 10 beträgt. Es wird ein Alarm angezeigt. Der spezifische Effekt ist wie folgt: Der Test wurde in der IE6-Umgebung bestanden.

2. HTML-Layout

Das p-Layout wird hier verwendet, das Tabellenlayout jedoch nicht gebraucht. Informationen zum spezifischen Float-Layout finden Sie unter „P+CSS-Webseiten-Layout-Fähigkeiten erlernen“. Ich werde hier nicht auf Details eingehen:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<title>告警提示</title>
</head>
<body>
<p style="float:left;">内容:</p><p id="errMsg" style="color:#ff0000;display:none;float:left;">错误!</p>
<p style="clear:both;"></p>
<p>
<textarea onchange="errTipsAlert(this)"></textarea><br />
</p>
</body>
</html>
Nach dem Login kopieren

Ich hoffe, jeder hat bemerkt, dass diese Alarmfunktion durch die Änderung des mehrzeiligen Textfelds ausgelöst wird. Wenn sie ausgelöst wird, übergibt sie sich an diese Funktion. Gleichzeitig wurde der Alarmtext eingestellt, dieser ist jedoch zunächst ausgeblendet.

Achten Sie gleichzeitig darauf, jquery zu Beginn einzuführen.

3. JQuery-Skript

Der Grund, warum FadeTo0 hier zum Ausblenden verwendet wird, ist nicht wie „JQ verwenden, um das grundlegendste zu schreiben“. Der Ein- und Ausblendeffekt wird mit show() und hide() angezeigt, da show() und hide() nicht über den Ein- und Ausblendeffekt verfügen. FadeIn und FadeOut führen dazu, dass sich der Text verschiebt, was nicht gut aussieht.


<script>
function errTipsAlert(obj){
 //obj把自己传递过来了,如果多行文本框里面的内容多于10个字
 if(obj.value.length>10){
  //那么错误提示文本errMsg就一开始在1秒之内透明度从0变成1,之后又在1秒之内透明度从1变成0,再同理变回来,从而实现淡入淡出的闪烁提示。
  $("#errMsg").fadeTo(1000,1).fadeTo(1000,0).fadeTo(1000,1);
  //然后多行文本框的边框加粗,变红
  $(obj).css("border","2px solid #ff0000");
 }
 else{
  //否则错误提示文本errMsg就在1毫秒内透明变变成0,相当于hide()方法,但是hide()在某些情况下会发生移位。
  $("#errMsg").fadeTo(1,0);
  //恢复多行文本框的边框
  $(obj).css("border","1px solid #cccccc");
 }
}
</script>
Nach dem Login kopieren

Animieren Sie keine mehrzeiligen Textfelder. Obwohl Sie die Eigenschaft „borderwidth“ wie „jQuery-Schleifenanimation und Komponentengröße abrufen“ animieren können, bleibt diese Animation sehr hängen. Es ist also besser, dies nicht zu tun.

Verwandte Empfehlungen:

PHP-Popup-Fehlerwarnfunktion


Das obige ist der detaillierte Inhalt vonjQuery implementiert das Effektbeispiel für die Ein- und Ausblendfunktion von IE6. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
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

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Was soll ich tun, wenn Google Chrome meldet, dass der Inhalt dieses Tabs geteilt wird? Was soll ich tun, wenn Google Chrome meldet, dass der Inhalt dieses Tabs geteilt wird? Mar 13, 2024 pm 05:00 PM

Was soll ich tun, wenn Google Chrome meldet, dass der Inhalt dieses Tabs geteilt wird? Wenn wir Google Chrome verwenden, um einen neuen Tab zu öffnen, stoßen wir manchmal auf die Meldung, dass der Inhalt dieses Tabs geteilt wird. Was ist also los? Auf dieser Website erhalten Benutzer eine detaillierte Einführung in das Problem, dass Google Chrome dazu auffordert, den Inhalt dieser Registerkarte zu teilen. Google Chrome weist darauf hin, dass der Inhalt dieser Registerkarte freigegeben wird: 1. Öffnen Sie Google Chrome. In der oberen rechten Ecke des Browsers werden drei Punkte angezeigt. Klicken Sie zum Ändern auf das Symbol das Symbol. 2. Nach dem Klicken wird unten das Menüfenster von Google Chrome angezeigt und die Maus bewegt sich zu „Weitere Tools“.

Wie verwende ich die PUT-Anfragemethode in jQuery? Wie verwende ich die PUT-Anfragemethode in jQuery? Feb 28, 2024 pm 03:12 PM

Wie verwende ich die PUT-Anfragemethode in jQuery? In jQuery ähnelt die Methode zum Senden einer PUT-Anfrage dem Senden anderer Arten von Anfragen, Sie müssen jedoch auf einige Details und Parametereinstellungen achten. PUT-Anfragen werden normalerweise zum Aktualisieren von Ressourcen verwendet, beispielsweise zum Aktualisieren von Daten in einer Datenbank oder zum Aktualisieren von Dateien auf dem Server. Das Folgende ist ein spezifisches Codebeispiel, das die PUT-Anforderungsmethode in jQuery verwendet. Stellen Sie zunächst sicher, dass Sie die jQuery-Bibliotheksdatei einschließen. Anschließend können Sie eine PUT-Anfrage senden über: $.ajax({u

Die Baidu Tieba-App meldet, dass der Vorgang zu häufig erfolgt. Was ist los? Die Baidu Tieba-App meldet, dass der Vorgang zu häufig erfolgt. Was ist los? Apr 01, 2024 pm 05:06 PM

Die Baidu Tieba-App weist darauf hin, dass der Vorgang zu häufig erfolgt, um den normalen Betrieb und die Benutzererfahrung der Plattform aufrechtzuerhalten, um böswilligen Bildschirm-Spam, Werbe-Spam und andere unangemessene Verhaltensweisen zu verhindern vom Herausgeber. Die Baidu Tieba-App meldet, dass der Vorgang zu häufig erfolgt. 1. Wenn das System die Meldung „Vorgang ist zu häufig“ anzeigt, müssen wir eine Weile warten. Wenn Sie Bedenken haben, können Sie zuerst etwas anderes tun. Im Allgemeinen wird diese Eingabeaufforderung nach einer Weile des Wartens automatisch ausgeblendet und wir können sie normal verwenden. 2. Wenn nach längerem Warten immer noch [Operation Too Frequent] angezeigt wird, können wir versuchen, zur Tieba Emergency Bar, Tieba Feedback Bar und anderen offiziellen Tieba zu gehen, dieses Phänomen zu melden und offizielles Personal zu bitten, es zu beheben. 3.

Wie entferne ich das Höhenattribut eines Elements mit jQuery? Wie entferne ich das Höhenattribut eines Elements mit jQuery? Feb 28, 2024 am 08:39 AM

Wie entferne ich das Höhenattribut eines Elements mit jQuery? Bei der Front-End-Entwicklung müssen wir häufig die Höhenattribute von Elementen manipulieren. Manchmal müssen wir möglicherweise die Höhe eines Elements dynamisch ändern, und manchmal müssen wir das Höhenattribut eines Elements entfernen. In diesem Artikel wird erläutert, wie Sie mit jQuery das Höhenattribut eines Elements entfernen, und es werden spezifische Codebeispiele bereitgestellt. Bevor wir jQuery zum Betreiben des Höhenattributs verwenden, müssen wir zunächst das Höhenattribut in CSS verstehen. Das Höhenattribut wird verwendet, um die Höhe eines Elements festzulegen

jQuery-Tipps: Ändern Sie schnell den Text aller a-Tags auf der Seite jQuery-Tipps: Ändern Sie schnell den Text aller a-Tags auf der Seite Feb 28, 2024 pm 09:06 PM

Titel: jQuery-Tipps: Ändern Sie schnell den Text aller Tags auf der Seite. In der Webentwicklung müssen wir häufig Elemente auf der Seite ändern und bedienen. Wenn Sie jQuery verwenden, müssen Sie manchmal den Textinhalt aller a-Tags auf der Seite gleichzeitig ändern, was Zeit und Energie sparen kann. Im Folgenden wird erläutert, wie Sie mit jQuery den Text aller Tags auf der Seite schnell ändern können, und es werden spezifische Codebeispiele angegeben. Zuerst müssen wir die jQuery-Bibliotheksdatei einführen und sicherstellen, dass der folgende Code in die Seite eingefügt wird: &lt

Verwenden Sie jQuery, um den Textinhalt aller a-Tags zu ändern Verwenden Sie jQuery, um den Textinhalt aller a-Tags zu ändern Feb 28, 2024 pm 05:42 PM

Titel: Verwenden Sie jQuery, um den Textinhalt aller Tags zu ändern. jQuery ist eine beliebte JavaScript-Bibliothek, die häufig zur Verarbeitung von DOM-Operationen verwendet wird. Bei der Webentwicklung müssen wir häufig den Textinhalt des Link-Tags (eines Tags) auf der Seite ändern. In diesem Artikel wird erläutert, wie Sie mit jQuery dieses Ziel erreichen, und es werden spezifische Codebeispiele bereitgestellt. Zuerst müssen wir die jQuery-Bibliothek in die Seite einführen. Fügen Sie den folgenden Code in die HTML-Datei ein:

So brechen Sie den automatischen Sprung zu Edge ab, wenn Sie den IE in Win10_Solution öffnen, um zum automatischen Sprung der IE-Browserseite zu gelangen So brechen Sie den automatischen Sprung zu Edge ab, wenn Sie den IE in Win10_Solution öffnen, um zum automatischen Sprung der IE-Browserseite zu gelangen Mar 20, 2024 pm 09:21 PM

In letzter Zeit haben viele Win10-Benutzer festgestellt, dass ihr IE-Browser bei der Verwendung von Computerbrowsern immer automatisch zum Edge-Browser springt. Wie kann man also den automatischen Sprung zum Edge beim Öffnen des IE in Win10 deaktivieren? Lassen Sie diese Website den Benutzern sorgfältig vorstellen, wie sie beim Öffnen des IE in Win10 automatisch zum Rand springen und schließen. 1. Wir melden uns beim Edge-Browser an, klicken auf ... in der oberen rechten Ecke und suchen nach der Dropdown-Einstellungsoption. 2. Nachdem wir die Einstellungen eingegeben haben, klicken Sie in der linken Spalte auf Standardbrowser. 3. Abschließend aktivieren wir in der Kompatibilität das Kontrollkästchen, um ein erneutes Laden der Website im IE-Modus zu verhindern, und starten den IE-Browser neu.

Wie kann man feststellen, ob ein jQuery-Element ein bestimmtes Attribut hat? Wie kann man feststellen, ob ein jQuery-Element ein bestimmtes Attribut hat? Feb 29, 2024 am 09:03 AM

Wie kann man feststellen, ob ein jQuery-Element ein bestimmtes Attribut hat? Wenn Sie jQuery zum Betreiben von DOM-Elementen verwenden, stoßen Sie häufig auf Situationen, in denen Sie feststellen müssen, ob ein Element ein bestimmtes Attribut hat. In diesem Fall können wir diese Funktion einfach mit Hilfe der von jQuery bereitgestellten Methoden implementieren. Im Folgenden werden zwei häufig verwendete Methoden vorgestellt, um festzustellen, ob ein jQuery-Element über bestimmte Attribute verfügt, und um spezifische Codebeispiele anzuhängen. Methode 1: Verwenden Sie die Methode attr() und den Operator typeof //, um zu bestimmen, ob das Element ein bestimmtes Attribut hat

See all articles