Detailed example of JQuery obtaining the text content of multiple select tag options

This article mainly brings you a JQuery to obtain the text content (example) of multiple select tag options. The editor thinks it’s pretty good, so I’ll share it with you now and give it as a reference. Let’s follow the editor to take a look, I hope it can help everyone.

According to the id attribute of the 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 all the items under multiple selects (use the class attribute, the values ​​are the same) The text value of option

$("#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 you can use the following method to display the queried 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 the text into a 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 above basis, 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
  }

Related recommendations:

Option label selected="selected" attribute failure solution

Comparison of the use of Optional in Java8 and nullable types in Kotlin Details

How JavaScript dynamically sets the selected instance analysis of Option in Select

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