データを交換するために 2 つのリストボックスを制御する JavaScript メソッド left と right_javascript スキル

この記事の例では、JavaScript が 2 つのリストボックス間のデータ交換を制御する方法を説明します。皆さんの参考に共有してください。具体的な分析は次のとおりです。

この関数は、左のリスト ボックスの要素を右に移動したり、右のリスト ボックスの要素を左に移動したりするためによく使用されます。

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

function listbox_moveacross(sourceID, destID) {
var src = document.getElementById(sourceID);
var dest = document.getElementById(destID);
for(var count=0; count < src.options.length; count ) {
If(src.options[count].selected == true) {
var オプション = src.options[count];
var newOption = document.createElement("option");
newOption.value = option.value;
newOption.text = option.text;
newOption.selected = true;
{
をお試しください Dest.Add（newoption、null）; src.remove(count, null);
}catch(error) {
dest.add(newOption) // IE のみ
; src.remove(count);
}
数えてください--;
}
}
}
//..
listbox_moveacross('countryList', 'selected CountryList');

以下は、ブラウザで直接実行できる、このようなデモンストレーションエフェクトコードです

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

選択したオプションを右または左に移動するには、下のボタンをクリックします。
<表>

   

 アフガニスタン
 バハマ
 バルバドス
 ベルギー
 ブータン
 中国
 クロアチア
 デンマーク
 フランス

   
   
        >> 

        <<
   
   

 アフガニスタン
 バハマ
 バルバドス
 ベルギー
 ブータン
 中国
 クロアチア
 デンマーク
 フランス

   


    <スクリプト>
function listboxMoveacross(sourceID, destID) {
    var src = document.getElementById(sourceID);
    var dest = document.getElementById(destID);
    for(var count=0; count < src.options.length; count ) {
        if(src.options[count].selected == true) {
                var オプション = src.options[カウント];
                var newOption = document.createElement("オプション");
                newOption.value = option.value;
                newOption.text = option.text;
                newOption.selected = true;
                {
を試してください                          dest.add(newOption, null); //標準
                         src.remove(count, null);
                 }キャッチ(エラー) {
                         dest.add(newOption); // IE のみ
                         src.remove(count);
                 }
                数える--;
        }
    }
}

ここで説明されている大家向けの JavaScript プログラムの設計が役立つことを望みます。

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。