js操作のselectとoptionでよく使うコード_基礎知識

1. 選択した選択範囲の値とテキストを取得します。HTML コードは次のとおりです。:

コードをコピーします。 > コードは次のとおりです:

oneオプション値="2" >2

<オプション値="3">/オプション>


次のスクリプト コードを使用します。 選択した値とテキストを取得します。

コードをコピーします。 コードは次のとおりです。 $("#mySelect" ).val(); //選択されたレコードの値を取得します

$("#mySelect option:selected").text(); //選択されたレコード

2. 新しい Option("text","value") メソッドを使用してオプション option

コードをコピー コードは次のようになります: var obj = document.getElementById("mySelect");obj.add(new Option("4"," 4"));

3. すべてのオプションを削除します。option

コードをコピー コードは次のとおりです: var obj = document.getElementById("mySelect");obj.options.length = 0;

4選択したオプションを削除します。

コードをコピーします。 コードは次のとおりです: var obj = document.getElementById("mySelect");var index = obj.selectedIndex;obj.options .remove(index);

5. 選択したオプション option

を変更します。

コードをコピー コードは次のとおりです。 var obj = document.getElementById("mySelect ");

varindex = obj.selectedIndex;

obj.options[index] = new Option( "three",3); //対応する値を変更します
obj.options[index].selected = true; //選択状態を維持します



6. 選択を削除します

コードをコピーします> コードは次のとおりです: var obj = document.getElementById("mySelect") ; obj.parentNode.removeChild(obj); // 現在のオブジェクトを削除します。 🎜>

7. 選択した応答イベントを選択します

コードをコピーします

コードは次のとおりです。以下のように: $("#mySelect").change(function(){ //実行する必要のあるものを追加しますオペレーションコード})

1. select

コードをコピー

コードは次のとおりです: 関数createSelect(){ var mySelect = document.createElement_x("select"); mySelect.id = "mySelect"; }

2. オプションを追加します

コードをコピーします
コードは次のとおりです:

function addOption(){ //ID に基づいてオブジェクトを検索します、var obj=document.getElementByIdx_x('mySelect') //オプションを追加しますobj .add(new Option("text","value")); //これは IE でのみ有効です

obj.options.add(new Option("text", "value")); IE および Firefox と互換性があります

}



3. すべてのオプションを削除します オプション

コードをコピーします
コードは次のとおりです。

function RemoveAll(){ var obj=document.getElementByIdx_x('mySelect'); obj .options.length= 0; }

4. オプションを削除します

コードをコピーします コードは次のとおりです:

removefunctionOne(){
var obj=document.getElementByIdx_x('mySelect');
//index、オプションのシリアル番号を削除するには、現在のオプションのシリアル番号を取得します。選択されたオプション
varindex=obj .selectedIndex;
obj.options.remove(index);

5. オプション の値を取得します。

コードをコピー コードは次のとおりです。

var obj=document.getElementByIdx_x('mySelect ');
varindex=obj.selectedIndex ; //シリアル番号、現在選択されているオプションのシリアル番号を取得します
var = obj.options[index].value; >
6. オプションのテキストを取得します

コードをコピーします

コードは次のとおりです: var obj=document.getElementByIdx_x('mySelect'); varindex=obj.selectedIndex; //シリアル番号、現在選択されているオプションのシリアル番号を取得します

var val = obj。 options[index].text;

7. オプション オプション

コードをコピーします

コードは次のとおりです: var obj=document.getElementByIdx_x('mySelect '); var index=obj.selectedIndex; // シリアル番号を取得します。現在選択されているオプション var val = obj.options[index]=new Option("新しいテキスト", "新しい値");

8. 選択を削除します。

コードをコピー
コードは次のとおりです。

function RemoveSelect(){ var mySelect = document.getElementByIdx_x("mySelect"); mySelect.parentNode.removeChild(mySelect);

インスタンス全体の完全なコードは次のとおりです
:

コードをコピーします
コードは次のとおりです:

<頭>


<スクリプト言語=JavaScript>
function $(id)
{
return document.getElementByIdx_x(id)
}
function show()
{
var selectObj=$("area")
var myOption=document.createElement_x("option")
myOption.setAttribute("value","10")
myOption.appendChild(document.createTextNode("上海"))
var myOption1= document.createElement_x("option")
myOption1.setAttribute("value","100")
myOption1.appendChild(document.createTextNode("南京"))
selectObj.appendChild(myOption)
selectObj.appendChild(myOption1)
}
function Choice()
{
varindex=$("area").selectedIndex;
var val=$("エリア").options[index].getAttribute("値")
if(val==10)
{
var i=$("コンテキスト") .childNodes.length-1;
var remobj=$("context").childNodes[i];
remobj.removeNode(true)
var sh=document.createElement_x("select")
sh.add(new Option("浦东新区","101"))
sh.add( new Option("黄浦区","102"))
sh.add(new Option("徐汇区","103"))
sh.add(new Option("普陀区","104 "))
$("context").appendChild(sh)
}
if(val==100)
{
var i=$("context").childNodes。長さ-1;
var remobj=$("context").childNodes[i];
remobj.removeNode(true)
var nj=document.createElement_x("select")
nj.add(new Option("玄武区","201"))
nj.add( new Option("白下区","202"))
nj.add(new Option("下关区","203"))
nj.add(new Option("栖霞区", "204"))
$("context").appendChild(nj)
}
}
function calc()
{
var x=$("context") .childNodes.length-1;
alert(x)
}
function delete()
{
var i=$("context").childNodes.length-1;
var remobj=$("context").childNodes[i];
remobj.removeNode(true)
}