0

私はJavaScriptでいくつかの選択を設定しています。それらのいくつかについては、選択オプションが同じであるため、1つのオプションを作成してから、関連するすべての選択を設定することを考えました。

これが私が実際に行っている方法です：

var option = document.createElement('option');
    option.text = 'please select a journal';
    option.value ='NULL';

    try 
    {
        selectSection.add(option, null);  // standards compliant; doesn't work in IE
    }
    catch(ex) 
    {
        selectSection.add(option);  // IE only
    }

    var option = document.createElement('option');
    option.text = 'please select a journal';
    option.value ='NULL';

    try 
    {
        selectSpecialIssue.add(option, null);  // standards compliant; doesn't work in IE
    }
    catch(ex) 
    {
        selectSpecialIssue.add(option);  // IE only
    }

    var option = document.createElement('option');
    option.text = 'please select a journal';
    option.value ='NULL';

    try 
    {
        selectVolume.add(option, null);  // standards compliant; doesn't work in IE
    }
    catch(ex) 
    {
        selectVolume.add(option);  // IE only
    }

                    .............ETC................

私は1つのオプションのみを作成しようとしました（オプションは同じです）そしてそれらの選択を入力します：

var option = document.createElement('option');
    option.text = 'please select a journal';
    option.value ='NULL';

    try 
    {
        selectSection.add(option, null);
                    selectSpecialIssue.add(option, null);
                    selectVolume.add(option, null);
    }
    catch(ex) 
    {
        selectSection.add(option);
                    selectSpecialIssue.add(option);
                    selectVolume.add(option);
    }

ここでのコードははるかにわかりやすく、理解しやすいですが、問題は、最後の選択（selectVolume）のみが入力されていることです。理由はわかりません。

4

2 に答える 2

1

オプションオブジェクトを新規に初期化しないためだと思います。したがって、各選択に要素を追加しますが、オプションのオブジェクトは1つしかないため、他の選択で削除する必要があります。より良い方法は、関数内でこれを行うことです。

function setOptionJournal(selection) {
  var option = document.createElement('option');
  option.text = 'please select a journal';
  option.value ='NULL';

  try 
  {
    selection.add(option, null);
  }
  catch(ex) 
  {
    selection.add(option);
  }
}
setOptionJournal(selectSection);
setOptionJournal(selectSpecialIssue);
setOptionJournal(selectVolume);
于 2012-08-08T06:44:55.930 に答える
1

オプションの作成を機能に移動できます

function createOption(text, value) {
            var option = document.createElement('option');
            option.text = text;
            option.value = value == null ? 'NULL' : value;  

            return option;
        }

そのようなコードを書いてください

            var selectSection = document.getElementById('selectSection');
            var selectSpecialIssue = document.getElementById('selectSpecialIssue');
            var selectVolume = document.getElementById('selectVolume');

            var selectText ='please select a journal';

            selectSection.add(createOption(selectText));
            selectSpecialIssue.add(createOption(selectText));
            selectVolume.add(createOption(selectText));

これははるかにきれいになります

于 2012-08-08T06:52:54.357 に答える