Heim Web-Frontend js-Tutorial jquery JSON-Methode zur Realisierung dynamischer Produktinhalte display_jquery

jquery JSON-Methode zur Realisierung dynamischer Produktinhalte display_jquery

May 16, 2016 pm 03:19 PM
jquery json 动态

Das Beispiel in diesem Artikel beschreibt, wie jquery json die dynamische Anzeige von Produktinhalten implementiert. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

<!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" xml:lang="zh" lang="zh" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<mce:script type="text/javascript" src="jquery-1.4.4.min.js" mce_src="jquery-1.4.4.min.js"></mce:script>
<title>Example | xHTML1.0</title>
</head>
<mce:style><!--
div{width:50px;height:50px;float:left;margin:10px; text-align:center;}
.a{font-size:50px;float:left; cursor:pointer;}
.b{font-size:50px;background-color:yellow;float:left; cursor:pointer;}
.border{border:2px solid;}
.bb{}
--></mce:style><style mce_bogus="1">div{width:50px;height:50px;float:left;margin:10px; text-align:center;}
.a{font-size:50px;float:left; cursor:pointer;}
.b{font-size:50px;background-color:yellow;float:left; cursor:pointer;}
.border{border:2px solid;}
.bb{}</style>
<mce:script type="text/javascript"><!--
$(function () { 
   var _json = {"red":{"small":"10","middle":"15","large":"20","max_large":"25"},"blue":{"small":"33","middle":"35","large":"9","max_large":"30"},"green":{"small":"34","middle":"30","large":"19","max_large":"3"},"orange":{"small":"9","middle":"15","large":"29","max_large":"18"}};
   var _color_value;
   var _size_value;
   var _store_value;
  $("#select_color div").click(function () {
    $("#select_color div").attr("class","/bb");
    $(this).attr("class","border");
    _color_value = $(this).attr("date-value");
    change_span_value()
  });
  $("#select_size div").click(function () {
    $("#select_size div").attr("class","a");
    $(this).attr("class","b");
    _size_value = $(this).attr("date-value");
    change_span_value()
  });
  function change_span_value() {
    var _value = _json[_color_value][_size_value];
    if (_value != undefined) {
      $("#span_store").text(_value+"件");
    }
  }
});
// --></mce:script>
<body>
<div style="width:100%;margin:10px;" id="select_color">
<div style="background-color:red;cursor:pointer;" mce_style="background-color:red;cursor:pointer;" date-value="red">Red</div>
<div style="background-color:blue;cursor:pointer;" mce_style="background-color:blue;cursor:pointer;" date-value="blue">Blue</div>
<div style="background-color:green;cursor:pointer;" mce_style="background-color:green;cursor:pointer;" date-value="green">Green</div>
<div style="background-color:orange;cursor:pointer;" mce_style="background-color:orange;cursor:pointer;" date-value="orange">Orange</div>
</div>
<div style="width:100%;margin:10px;" id="select_size">
<div class="a" date-value="small">S</div>
<div class="b" date-value="middle">M</div>
<div class="a" date-value="large">L</div>
<div class="a" date-value="max_large">XL</div>
</div>
<div style="width:100%;margin:10px;text-align:left;" id="select_store">
库存:(<span id="span_store">1000件</span>)
</div>
<div style="border:2px solid;width:100px;height:100px;background-color:gray"></div>
</body>
</html>

Nach dem Login kopieren

Leser, die an weiteren Inhalten zum Betrieb von JSON durch jQuery interessiert sind, können sich das spezielle Thema dieser Website ansehen: „Eine Zusammenfassung der Techniken zum Betrieb von JSON-Daten durch jQuery

Ich hoffe, dass dieser Artikel allen in der jQuery-Programmierung hilfreich sein wird.

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ßer Artikel

<🎜>: Bubble Gum Simulator Infinity - So erhalten und verwenden Sie Royal Keys
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
Nordhold: Fusionssystem, erklärt
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
Mandragora: Flüstern des Hexenbaum
3 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

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)

Heiße Themen

Java-Tutorial
1673
14
PHP-Tutorial
1277
29
C#-Tutorial
1257
24
Konvertieren Sie die Festplatte von VirtualBox in eine dynamische Festplatte und umgekehrt Konvertieren Sie die Festplatte von VirtualBox in eine dynamische Festplatte und umgekehrt Mar 25, 2024 am 09:36 AM

Beim Erstellen einer virtuellen Maschine werden Sie aufgefordert, einen Festplattentyp auszuwählen. Sie können zwischen einer festen Festplatte und einer dynamischen Festplatte wählen. Was ist, wenn Sie sich für Festplatten entscheiden und später feststellen, dass Sie dynamische Festplatten benötigen, oder umgekehrt? Sie können die eine in die andere konvertieren. In diesem Beitrag erfahren Sie, wie Sie eine VirtualBox-Festplatte in eine dynamische Festplatte umwandeln und umgekehrt. Eine dynamische Festplatte ist eine virtuelle Festplatte, die zunächst klein ist und mit der Speicherung von Daten in der virtuellen Maschine immer größer wird. Dynamische Festplatten sparen sehr effizient Speicherplatz, da sie nur so viel Host-Speicherplatz beanspruchen, wie benötigt wird. Wenn jedoch die Festplattenkapazität zunimmt, kann die Leistung Ihres Computers geringfügig beeinträchtigt werden. In virtuellen Maschinen werden häufig Festplatten und dynamische Festplatten verwendet

Tipps zur Leistungsoptimierung für die Konvertierung von PHP-Arrays in JSON Tipps zur Leistungsoptimierung für die Konvertierung von PHP-Arrays in JSON May 04, 2024 pm 06:15 PM

Zu den Leistungsoptimierungsmethoden für die Konvertierung von PHP-Arrays in JSON gehören: Verwendung von JSON-Erweiterungen und der Funktion json_encode(); Verwendung von Puffern zur Verbesserung der Leistung der Schleifencodierung; JSON-Codierungsbibliothek.

Wie steuern Anmerkungen in der Jackson-Bibliothek die JSON-Serialisierung und -Deserialisierung? Wie steuern Anmerkungen in der Jackson-Bibliothek die JSON-Serialisierung und -Deserialisierung? May 06, 2024 pm 10:09 PM

Anmerkungen in der Jackson-Bibliothek steuern die JSON-Serialisierung und -Deserialisierung: Serialisierung: @JsonIgnore: Ignorieren Sie die Eigenschaft @JsonProperty: Geben Sie den Namen an @JsonGetter: Verwenden Sie die get-Methode @JsonSetter: Verwenden Sie die set-Methode Deserialisierung: @JsonIgnoreProperties: Ignorieren Sie die Eigenschaft @ JsonProperty: Geben Sie den Namen @JsonCreator an: Verwenden Sie den Konstruktor @JsonDeserialize: Benutzerdefinierte Logik

Vertiefendes Verständnis von PHP: Implementierungsmethode zur Konvertierung von JSON Unicode in Chinesisch Vertiefendes Verständnis von PHP: Implementierungsmethode zur Konvertierung von JSON Unicode in Chinesisch Mar 05, 2024 pm 02:48 PM

Vertiefendes Verständnis von PHP: Implementierungsmethode zum Konvertieren von JSONUnicode in Chinesisch Während der Entwicklung stoßen wir häufig auf Situationen, in denen wir JSON-Daten verarbeiten müssen, und die Unicode-Codierung in JSON verursacht in einigen Szenarien einige Probleme, insbesondere wenn Unicode konvertiert werden muss Bei der Kodierung wird in chinesische Zeichen konvertiert. In PHP gibt es einige Methoden, die uns bei der Umsetzung dieses Konvertierungsprozesses helfen können. Im Folgenden wird eine allgemeine Methode vorgestellt und es werden spezifische Codebeispiele bereitgestellt. Lassen Sie uns zunächst das Un in JSON verstehen

Wie verwende ich PHP-Funktionen zur Verarbeitung von JSON-Daten? Wie verwende ich PHP-Funktionen zur Verarbeitung von JSON-Daten? May 04, 2024 pm 03:21 PM

PHP bietet die folgenden Funktionen zur Verarbeitung von JSON-Daten: JSON-Daten analysieren: Verwenden Sie json_decode(), um einen JSON-String in ein PHP-Array zu konvertieren. JSON-Daten erstellen: Verwenden Sie json_encode(), um ein PHP-Array oder -Objekt in einen JSON-String zu konvertieren. Erhalten Sie bestimmte Werte von JSON-Daten: Verwenden Sie PHP-Array-Funktionen, um auf bestimmte Werte wie Schlüssel-Wert-Paare oder Array-Elemente zuzugreifen.

Wie speichere ich JSON-Daten in einer Datenbank in Golang? Wie speichere ich JSON-Daten in einer Datenbank in Golang? Jun 06, 2024 am 11:24 AM

JSON-Daten können mithilfe der gjson-Bibliothek oder der json.Unmarshal-Funktion in einer MySQL-Datenbank gespeichert werden. Die gjson-Bibliothek bietet praktische Methoden zum Parsen von JSON-Feldern, und die Funktion json.Unmarshal erfordert einen Zieltypzeiger zum Unmarshalieren von JSON-Daten. Bei beiden Methoden müssen SQL-Anweisungen vorbereitet und Einfügevorgänge ausgeführt werden, um die Daten in der Datenbank beizubehalten.

Einführung in das Hinzufügen neuer Zeilen zu einer Tabelle mit jQuery Einführung in das Hinzufügen neuer Zeilen zu einer Tabelle mit jQuery Feb 29, 2024 am 08:12 AM

jQuery ist eine beliebte JavaScript-Bibliothek, die häufig in der Webentwicklung verwendet wird. Während der Webentwicklung ist es häufig erforderlich, mithilfe von JavaScript dynamisch neue Zeilen zu Tabellen hinzuzufügen. In diesem Artikel wird erläutert, wie Sie mit jQuery neue Zeilen zu einer Tabelle hinzufügen, und es werden spezifische Codebeispiele bereitgestellt. Zuerst müssen wir die jQuery-Bibliothek in die HTML-Seite einführen. Die jQuery-Bibliothek kann über den folgenden Code in das Tag eingeführt werden:

Schnelle Tipps zum Konvertieren von PHP-Arrays in JSON Schnelle Tipps zum Konvertieren von PHP-Arrays in JSON May 03, 2024 pm 06:33 PM

PHP-Arrays können über die Funktion json_encode() in JSON-Strings konvertiert werden (zum Beispiel: $json=json_encode($array);) und umgekehrt kann die Funktion json_decode() zum Konvertieren von JSON in Arrays ($array=) verwendet werden json_decode($json);) . Weitere Tipps sind die Vermeidung tiefgreifender Konvertierungen, die Angabe benutzerdefinierter Optionen und die Verwendung von Bibliotheken von Drittanbietern.

See all articles