JQuery gets the text content of multiple select tag options (example)

The following editor will bring you an articleJQuery Get the text content (example) of multiple select tag options. The editor thinks it's pretty good, so now I'll share the jquery source code with you and give it as a reference. If you are interested in jquery, follow the editor to have a look.

According to the id attribute of option, modify the text value

$("#sel_p .select_class option[id='-选择省-']").text(data.province).attr("selected",true);
 $("#sel_p .select_class option[id='-选择市-']").text( data.city).attr("selected",true);
 $("#sel_p .select_class option[id='-选择区-']").text( data.area).attr("selected",true);
 $("#sel_p .select_class option[id='-选择街-']").text( data.street).attr("selected",true);

Get multiple selects (use class The text values ​​of all options under the attribute (the same value)

$("#sel_p .select_class option").each(function(){ //遍历所有option标签

   var text = $(this).text(); //获取option的text
   alert(text);//显示的是当前这个option的text值
　　　if(txt == "选择省")
     $("#sel_p .select_class option[id='-选择省-']").text(data.province).attr("selected",true);
   if(txt == "选择市")
     $("#sel_p .select_class option[id='-选择市-']").text( data.city).attr("selected",true);
   if(txt == "选择区")
     $("#sel_p .select_class option[id='-选择区-']").text( data.area).attr("selected",true);
  if(txt == "选择街")
     $("#sel_p .select_class option[id='-选择街-']").text( data.street).attr("selected",true);

 });

If there is no cascading relationship in the select, then all options have been loaded and can be displayed using the following methodQuery The data

$("#sel_p .select_class option[id="+data.province+"]").attr("selected",true);
$("#sel_p .select_class option[id="+data.city+"]").attr("selected",true);
$("#sel_p .select_class option[id="+data.area+"]").attr("selected",true);
$("#sel_p .select_class option[id="+data.street+"]").attr("selected",true);

Another way to get all options is equivalent to spelling all text into string and storing each character in the map

var map = $("#sel_p .select_class option").map(function(){

    alert($(this).text());//显示单个option的text  text1

    return $(this).text();
  }).get().join(",");

alert(map);//显示的是 text1，text2，text3
alert(map[0]);//显示 t

Improve on the basis of the above, use array array to store the queried data, and use for loop to operate the data

var array = new Array();
  $("#leaf .form-control option").map(function(){
    array.push($(this).text());
  })
  for(var i = 0; i < array.length; i ++ ){
    alert(array[i]);//显示每个option的text  text1，text2，text3
  }

The above article JQuery gets the text content (example) of multiple select tag options. This is all the content that the editor has shared with you. I hope it can give you a reference! !

Related recommendations:

Summary of DOM node operation methods in jQuery

bootstrap editable drop-down box jquery.editable-select Detailed example explanation

js, jQuery and easyui realize the designated assignment of the drop-down box example sharing

The above is the detailed content of JQuery gets the text content of multiple select tag options (example). For more information, please follow other related articles on the PHP Chinese website!