JS implementiert die Sternebewertung
Dieses Mal werde ich Ihnen JS zur Implementierung der Sternebewertung vorstellen. Was sind die Vorsichtsmaßnahmen für die Implementierung der Sternebewertung durch JS?
Obwohl es einfach ist, gibt es dennoch ein paar Dinge zu beachten:
1. Wenn der Hover-Effekt nicht angeklickt wird, leuchten die Sterne auf, wenn sich die Maus bewegt.
2. Klicken Sie, um den Hover-Effekt zu deaktivieren.
3. Klicken Sie auf denselben Stern und der Stern kann jederzeit seine Farbe ändern.
Spezifische Codeanzeige:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport"content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
</head>
<style type="text/css">
.stars{
white-space: nowrap;
text-align: center;
margin-top: 20px;
margin-bottom: 20px;
}
.stars li{
display: inline-block;
color:#ADADAD;
font-size: 40px;
}
</style>
<body>
<ul class="stars">
<li>★</li>
<li>★</li>
<li>★</li>
<li>★</li>
<li>★</li>
</ul>
<script src="../../js/common/jquery-git.js"></script>
<script>
$(function() {
//为星星设置hover效果
varisClicked =false;
varbeforeClickedIndex = -1;
varclickNum = 0;//点击同一颗星次数
$('li').hover(
function() {
if(!isClicked) {
$(this).css('color','#F0AD4E');
varindex = $(this).index();
for(vari = 0; i <= index; i++) {
$('li:nth-child('+ i +')').css('color','#F0AD4E');
}
}
},
function() {
if(!isClicked) {
$('li').css('color','#ADADAD');
}
}
);
//星星点击事件
$('li').click(function() {
$('li').css('color','#ADADAD');
isClicked =true;
varindex = $(this).index();
for(vari = 1; i <= index+1; i++) {
$('li:nth-child('+ i +')').css('color','#F0AD4E');
}
if(index == beforeClickedIndex) {//两次点击同一颗星星 该星星颜色变化
clickNum++;
if(clickNum % 2 == 1) {
$('li:nth-child('+ (index + 1) +')').css('color','#ADADAD');
}else{
$('li:nth-child('+ (index + 1) +')').css('color','#F0AD4E');
}
}else{
clickNum = 0;
beforeClickedIndex = index;
}
});
});
</script>
</body>
</html>Ich glaube, Sie beherrschen die Methode zum Lesen dieses Artikels. Weitere spannende Artikel finden Sie auf der chinesischen PHP-Website! Empfohlene Lektüre:
Das obige ist der detaillierte Inhalt vonJS implementiert die Sternebewertung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Heiße KI -Werkzeuge
Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos
AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.
Undress AI Tool
Ausziehbilder kostenlos
Clothoff.io
KI-Kleiderentferner
AI Hentai Generator
Erstellen Sie kostenlos Ai Hentai.
Heißer Artikel
Heiße Werkzeuge
Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor
SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen
Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung
Dreamweaver CS6
Visuelle Webentwicklungstools
SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)
Heiße Themen
1386
52
So implementieren Sie ein Online-Spracherkennungssystem mit WebSocket und JavaScript
Dec 17, 2023 pm 02:54 PM
So implementieren Sie mit WebSocket und JavaScript ein Online-Spracherkennungssystem. Einführung: Mit der kontinuierlichen Weiterentwicklung der Technologie ist die Spracherkennungstechnologie zu einem wichtigen Bestandteil des Bereichs der künstlichen Intelligenz geworden. Das auf WebSocket und JavaScript basierende Online-Spracherkennungssystem zeichnet sich durch geringe Latenz, Echtzeit und plattformübergreifende Eigenschaften aus und hat sich zu einer weit verbreiteten Lösung entwickelt. In diesem Artikel wird erläutert, wie Sie mit WebSocket und JavaScript ein Online-Spracherkennungssystem implementieren.
WebSocket und JavaScript: Schlüsseltechnologien zur Implementierung von Echtzeitüberwachungssystemen
Dec 17, 2023 pm 05:30 PM
WebSocket und JavaScript: Schlüsseltechnologien zur Realisierung von Echtzeit-Überwachungssystemen Einführung: Mit der rasanten Entwicklung der Internet-Technologie wurden Echtzeit-Überwachungssysteme in verschiedenen Bereichen weit verbreitet eingesetzt. Eine der Schlüsseltechnologien zur Erzielung einer Echtzeitüberwachung ist die Kombination von WebSocket und JavaScript. In diesem Artikel wird die Anwendung von WebSocket und JavaScript in Echtzeitüberwachungssystemen vorgestellt, Codebeispiele gegeben und deren Implementierungsprinzipien ausführlich erläutert. 1. WebSocket-Technologie
Wie verwende ich das Xiaomi Mi 14 Ultra AIGC Magic Elimination Pro?
Mar 16, 2024 pm 01:34 PM
Heutzutage bringen große Mobiltelefonmarken neue Produkte mit immer mehr Funktionen auf den Markt. Das Xiaomi Mi 14 Ultra erfreut sich in letzter Zeit großer Beliebtheit und erregt große Aufmerksamkeit auf dem Markt. Ich glaube, dass viele Verbraucher mehr an diesem Telefon interessiert sind. Der folgende Editor zeigt Ihnen, wie Sie das Xiaomi 14UltraAIGC Magic Elimination Pro verwenden. Schauen Sie sich die einzelnen Tutorials an! Wie verwende ich die magische Eliminierung des Xiaomi 14UltraAIGC? Öffnen Sie Xiaomi 14Ultra, suchen Sie die Fotoalbum-Software auf dem Desktop und rufen Sie sie auf, wählen Sie die Bilder aus, die Sie entfernen möchten, und starten Sie die Fotoalbum-Bearbeitung. Wählen Sie die Option „Magic Elimination“ und klicken Sie oben rechts auf „Pro“, um Magic Elimination Pro aufzurufen und den intelligenten Ort auszuwählen, zu dem Sie gehen möchten.
Verwendung von JavaScript und WebSocket zur Implementierung eines Echtzeit-Online-Bestellsystems
Dec 17, 2023 pm 12:09 PM
Einführung in die Verwendung von JavaScript und WebSocket zur Implementierung eines Online-Bestellsystems in Echtzeit: Mit der Popularität des Internets und dem Fortschritt der Technologie haben immer mehr Restaurants damit begonnen, Online-Bestelldienste anzubieten. Um ein Echtzeit-Online-Bestellsystem zu implementieren, können wir JavaScript und WebSocket-Technologie verwenden. WebSocket ist ein Vollduplex-Kommunikationsprotokoll, das auf dem TCP-Protokoll basiert und eine bidirektionale Kommunikation zwischen Client und Server in Echtzeit realisieren kann. Im Echtzeit-Online-Bestellsystem, wenn der Benutzer Gerichte auswählt und eine Bestellung aufgibt
So löschen Sie Ihre eigenen Bewertungsdatensätze auf Dianping.
Mar 12, 2024 am 11:52 AM
Wir alle mögen Dianping, eine hochwertige Life-Service-Software, die den Konsum aller Menschen fördern und einige der Verbraucherdienste hier besser erhalten kann. Im Allgemeinen kann sie dafür sorgen, dass sich jeder sehr zufrieden fühlt und die verschiedenen Dienste hier genießen kann von einigen Geschäften und ermöglichen es Ihnen, diese zuerst zu durchsuchen und auszuprobieren. In vielen Fällen können Sie eine große Anzahl echter Konsumbewertungen von Kunden erhalten. Schauen Sie sich hier einige der Must-Eat- und Must-Play-Listen an, die es Ihnen ermöglichen, gute Orte zu finden und direkt einzukaufen. Und nachdem Sie Ihren Konsum beendet haben, können Sie einige Ihrer Kommentare direkt hinterlassen Natürlich sind alle mit einigen Ihrer Kommentare zufrieden
So implementieren Sie ein Online-Reservierungssystem mit WebSocket und JavaScript
Dec 17, 2023 am 09:39 AM
So implementieren Sie ein Online-Reservierungssystem mit WebSocket und JavaScript. Im heutigen digitalen Zeitalter müssen immer mehr Unternehmen und Dienste Online-Reservierungsfunktionen bereitstellen. Es ist von entscheidender Bedeutung, ein effizientes Online-Reservierungssystem in Echtzeit zu implementieren. In diesem Artikel wird erläutert, wie Sie mit WebSocket und JavaScript ein Online-Reservierungssystem implementieren, und es werden spezifische Codebeispiele bereitgestellt. 1. Was ist WebSocket? WebSocket ist eine Vollduplex-Methode für eine einzelne TCP-Verbindung.
Wie wäre es mit Snapdragon g3x gen2?
Mar 04, 2024 am 09:07 AM
Viele Benutzer wissen nicht viel über die Leistung von Snapdragon g3xgen2 und trauen sich daher nicht, das entsprechende Produkt zu kaufen. Lassen Sie uns kurz über die Leistung von Snapdragon g3xgen2 sprechen. Wie wäre es mit Snapdragon g3xgen2? Antwort: Die Gesamtverbesserung ist immer noch enorm. Daher ist die Leistung hinsichtlich der Effekte grundsätzlich sehr spannend. 1. Im Vergleich zur Vorgängergeneration hat sich der Snapdragon G3xGen2-Prozessor um 30 % verbessert, während sich die GPU-Leistung verdoppelt hat. 2. Dieser Prozessor kann Handheld-Geräte mit plattformübergreifenden Gaming-Funktionen sowie Geräte für Android-, PC- und Cloud-Konsolenspiele unterstützen. 3. Unterstützt Raytracing und ermöglicht Benutzern auch Live-Übertragungen während Spielen. 4. Mit WiFi7- und 5G-Millimeterwellen-Verbindungsfunktionen ist dies möglich
JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Wettervorhersagesystems
Dec 17, 2023 pm 05:13 PM
JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Wettervorhersagesystems Einführung: Heutzutage ist die Genauigkeit von Wettervorhersagen für das tägliche Leben und die Entscheidungsfindung von großer Bedeutung. Mit der Weiterentwicklung der Technologie können wir genauere und zuverlässigere Wettervorhersagen liefern, indem wir Wetterdaten in Echtzeit erhalten. In diesem Artikel erfahren Sie, wie Sie mit JavaScript und WebSocket-Technologie ein effizientes Echtzeit-Wettervorhersagesystem aufbauen. In diesem Artikel wird der Implementierungsprozess anhand spezifischer Codebeispiele demonstriert. Wir
