ホームページ >ウェブフロントエンド >jsチュートリアル >複数の選択タグ オプションのテキスト コンテンツを取得する JQuery の詳細な例
この記事では主に、複数の選択タグオプションのテキストコンテンツ(例)を取得するための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);
すべてのオプションを取得する別の方法。これは以下と同等です。すべてのテキストを文字列にスペルし、各文字を変換します マップに保存します
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 }
関連する推奨事項:
オプション タグ selected="selected" 属性の失敗の解決策
Java8 での Optional の使用と Kotlin での null 許容型の使用の詳細を比較
JavaScript が選択されたオプションを動的に設定する方法の分析選択中
以上が複数の選択タグ オプションのテキスト コンテンツを取得する JQuery の詳細な例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。