Heim > Web-Frontend > js-Tutorial > Hauptteil

Klicken Sie in der EasyUI-Dropdown-Liste auf ein Beispiel für die gemeinsame Nutzung von Ereignissen

小云云
Freigeben: 2018-01-12 09:14:49
Original
1435 Leute haben es durchsucht

Dieser Artikel stellt hauptsächlich die Verwendung von easyUI-Dropdown-Listen-Klickereignissen im Detail vor. Interessierte Freunde können darauf verweisen.

Das Beispiel in diesem Artikel zeigt die Methode zur Verwendung des EasyUI-Dropdown-Listen-Klickereignisses als Referenz. Der spezifische Inhalt ist wie folgt

Sie können Eingabe und verwenden AuswählenSo erstellen Sie eine Dropdown-Liste

Die Auswahl wird wie folgt erstellt:

Erstellen Sie ein JS-Array über JSON


[{  
  "id":1,  
  "text":"text1"  
},{  
  "id":2,  
  "text":"text2"  
},{  
  "id":3,  
  "text":"text3",  
  "selected":true  
},{  
  "id":4,  
  "text":"text4"  
},{  
  "id":5,  
  "text":"text5"  
}]
Nach dem Login kopieren

Beispiel:

HTML-Codeausschnitt:


<select id="in_edit_netlink" style="width:160px;" class="easyui-combobox" data-options="valueField:&#39;id&#39;,textField:&#39;text&#39;,editable:false" >
</select>
Nach dem Login kopieren

JS-Codeausschnitt:


var ljfsArray = new Array();
  var objHTTP = new Object();
  objHTTP.text = "HTTP";
  var objTCP = new Object();
  objTCP.text = "TCP";
  objTCP.id = 1;
  objHTTP.id = 2;
  if (data.ljfs == "HTTP") {
    objHTTP.selected=true;
  } else {
    objTCP.selected=true;
  }
  ljfsArray.push(objHTTP);
  ljfsArray.push(objTCP);
  $(&#39;#in_edit_netlink&#39;).combobox(&#39;loadData&#39;, ljfsArray);
Nach dem Login kopieren

Seite Effektanzeige:

Attributerklärung:

valueField:'id'---objTCP.id-- ->Optionswertwert
textField :'text'---objTCP.text--->Seitenanzeigewert
objTCP.selected=true; --->Standardanzeige

Klicken Sie, um das Ereignis zu ändern  

onSelect entspricht onChange
, aber das Problem ist: onChange wird in easyUI nicht unterstützt und onSelect wird in HTML nicht unterstützt.
onSelect muss im js-Code verwendet werden:


$("#in_edit_netlink").combobox({
    onSelect: function () {
      connectionType = $(&#39;#in_edit_netlink&#39;).val();
      if (connectionType == 1) {
       $(&#39;#in_edit_sjjh&#39;).textbox(&#39;setValue&#39;, tcpIp);
      } else {
       $(&#39;#in_edit_sjjh&#39;).textbox(&#39;setValue&#39;, httpIp);
      }
    }
  })
Nach dem Login kopieren

Verwenden Sie


$(function () {
  
})
Nach dem Login kopieren

Nach dem Standardladen kann das onSelect-Ereignis normal verwendet werden.

Verwandte Empfehlungen:

Das Startdatum der EasyUI Datebox-Datumsüberprüfung liegt vor der Endzeit der Beispielfreigabe

easyUI Beispiele für die Verwendung von Droppable und Draggable in Drag-Operationen

Detaillierte Erläuterung der Inline-Bearbeitungsbeispiele von dataGrid in EasyUI

Das obige ist der detaillierte Inhalt vonKlicken Sie in der EasyUI-Dropdown-Liste auf ein Beispiel für die gemeinsame Nutzung von Ereignissen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage