>  기사  >  웹 프론트엔드  >  여러 선택 태그 옵션의 텍스트 콘텐츠를 얻는 JQuery의 자세한 예

여러 선택 태그 옵션의 텍스트 콘텐츠를 얻는 JQuery의 자세한 예

小云云
小云云원래의
2017-12-29 10:14:041454검색

이 기사에서는 주로 여러 선택 태그 옵션의 텍스트 콘텐츠(예제)를 얻기 위한 JQuery에 대한 기사를 제공합니다. 편집자님이 꽤 좋다고 생각하셔서 지금 공유하고 모두에게 참고용으로 드리고자 합니다. 편집자를 따라 살펴보겠습니다. 모두에게 도움이 되기를 바랍니다.

옵션의 id 속성에 따라 텍스트 값 수정


$("#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);

다중 선택 시 모든 옵션의 텍스트 값 가져오기(class 속성 사용 시 컷 값 동일)


$("#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);

 });

선택 관계 중간에 캐스케이드가 없으면 다음 방법을 사용하여 쿼리된 데이터를 표시할 수 있습니다


$("#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);

모든 옵션을 얻는 또 다른 방법은 모든 텍스트의 철자를 입력하는 것과 같습니다. 각 문자를 문자열로 변환하여 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

위 내용을 개선하여 배열 배열을 사용하여 쿼리된 데이터를 저장하고 for 루프를 사용하여 데이터를 연산


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
  }

관련 권장사항:

option selected="selected" 속성 태그 실패에 대한 솔루션

Java8의 Optional 사용과 Kotlin의 null 허용 유형 비교 세부정보

JavaScript가 Select에서 선택된 Option을 동적으로 설정하는 방법 분석

위 내용은 여러 선택 태그 옵션의 텍스트 콘텐츠를 얻는 JQuery의 자세한 예의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.