Heim > Artikel > Web-Frontend > So verwenden Sie die Select-Komponente in JQuery
Dieses Mal zeige ich Ihnen, wie Sie die Select-Komponente in JQuery verwenden und welche Vorsichtsmaßnahmen für die Verwendung der Select-Komponente in JQuery gelten. Das Folgende ist ein praktischer Fall, schauen wir uns das an.
jquery ruft den ausgewählten Text und Wert ab
Auswahl abrufen:
Ausgewählten Text abrufen:
$(“#ddlregtype”).find(“option:selected”).text();
Ausgewählten Wert abrufen:
$(“#ddlregtype “).val();
Ausgewählten Index abrufen:
$(“#ddlregtype “).get(0).selectedindex;
Auswahl festlegen:
Ausgewählten Index auswählen:
$(“#ddlregtype “).get(0).selectedindex=index;//index为索引值
Ausgewählten Wert festlegen:
(“#ddlregtype “).attr(“value”,”normal“);(“#ddlregtype “).attr(“value”,”normal“);(“#ddlregtype “).val(“normal”); $(“#ddlregtype “).get(0).value = value;
Ausgewählten Text auswählen :
var count=$("#ddlregtype option").length; for(var i=0;i<count;i++) { if($("#ddlregtype ").get(0).options[i].text == text) { $("#ddlregtype ").get(0).options[i].selected = true; break; } } $("#select_id option[text='jquery']").attr("selected", true);
Auswahloption festlegen:
$("#select_id").append("<option value='value'>text</option>"); //添加一项option $("#select_id").prepend("<option value='0'>请选择</option>"); //在前面插入一项option $("#select_id option:last").remove(); //删除索引值最大的option $("#select_id option[index='0']").remove();//删除索引值为0的option $("#select_id option[value='3']").remove(); //删除值为3的option $("#select_id option[text='4']").remove(); //删除text值为4的option
Auswahl löschen:
$("#ddlregtype ").empty();
Arbeitsanforderungen, Notwendigkeit, Werte aus zwei Formularen abzurufen. Wie im Bild gezeigt:
Wie gelangt der Mehrwert vom linken Auswahlfeld zum rechten Auswahlfeld? Ich dachte darüber nach, Webseiten-Spezialeffekte zu verwenden, um es zu bekommen, und hier wurde die beliebtere JQuery verwendet.
JS-Code lautet wie folgt:
//获取所有属性值 var item = $("#select1").val(); $(function(){ $('#select1').each( //获得select1的所有值 function(){ $('button').click(function(){ alert($('#select2').val()); //获得select2中的select1值 }); }); }) </script>
Es ist erwähnenswert, dass er nicht direkt als
$(function(){ $('#select2').each( //获得select1的所有值,因为前面讲选项从左边添加到右边,jquery其实并没有真正将值从左边传到右边。 function(){ $('button').click(function(){ alert($(this).val()); //获得select2中的select1值 }); }); })
HTML geschrieben werden kann:
Option 1
Option 2
Option 3
Option 4
Option 5
Option 6
Option 7
Überprüfen zum Rechten hinzufügen> 🎜>Verwenden Sie JQuery und Ajax, um die Option „Auswählen“ aufzurufen.
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 auf der chinesischen PHP-Website!
//绑定ClassLevel1单击事件 $("#ClassLevel1").change(function () { var id = $("#ClassLevel1").val(); var level2 = $("#ClassLevel2"); level2.empty(); $("#ClassLevel3").hide(); $.ajax({ url: "./askCommon.ashx?action=getclasslevel&pid=" + id, data: { "type": "ajax" }, datatype: "json", type: "get", success: function (data) { var json = eval_r(data); for (var ind in json) { level2.append($("<option value='" + json[ind].id + "'>" + json[ind].typename + "</option>")); } } }); })So erzielen Sie den JQuery-Carriage-Return-Anmeldeeffekt Fall und detaillierte Erklärung des Mouse-Out-Ereignisses
Detaillierte Erklärung zur Verwendung von WebSocket
Das obige ist der detaillierte Inhalt vonSo verwenden Sie die Select-Komponente in JQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!