のJavaScript

Question

は、私は、次のコードを持っています10項目を選択しますが、ドロップダウン・オプションは最初のユーザーに対してのみ機能します。

私は問題はすべてのユーザーに対して同じIDによって引き起こされていることを推測していると私はこのようなものを使用する必要がありますが、私はあなたのIDのニーズにインターネット上

Answer 1

を任意の特定の答えを見つけることができません一意であること。同じページで同じIDを2回使用することはできません。

<select class="select-dropdown"> 

がjQuery as your Javascript frameworkを使用してではなく、物事を自分でやろうと考えてみましょう：

は彼らの代わりにクラスを与えます。それはあなたに多くの時間とエネルギーを節約します。

あなたは、単純なセレクタを使用して選択要素の全てを取得することができますjQueryので

：

var selectElements = $('.select-dropdown'); 

また、あなたはまま現在使用しているあなたのインラインイベントの添付ファイルを取り除くことができるようになります。 HTMLでイベントをアタッチするのは悪い習慣です。 jQueryの使い方

：

$('.select-dropdown').click(function(){ 
     // This refers to the dropdown that is currently clicked. 
     var currentSelect = $(this); 

     // Code here that executes when the dropdown is clicked. 
    }); 

UPDATE はここで、古いSKOOLの道を、現在のselect要素を取得する例を示します：http://jsfiddle.net/G2ZuE/

Answer 2

あなたは別のHTML要素に同じIDを割り当てることはできません、あなたはselect IDに接尾辞を追加し、ID接頭辞または共通のCSSクラスで循環させることができます（もしJQueryやMooToolsのようなlibを使うことができれば、もっと簡単です）。

here for a pure-javascript sample implementationを参照してください。

var users = document.getElementById("users"); 
var dpDowns = users.getElementsByTagName("select"); 
for (var i = 0; i < dpDowns.length; i++) { 
    //alert(dpDowns[i].id); 
} 

Answer 3

あなたの推測は正しいものでした。さらに、HTMLではなくJSにイベント処理を配置する必要があります。次のコードはそれを行う必要があります。

HTML：

<select class="someClass"> 
    </select> 

    <select class="someClass"> 
    </select> 

    <select class="someClass"> 
    </select> 

はJavaScript

// grab selects 
    var selects = document.getElementsByClassName("someClass"); 
    var optionsAsString = "option__option"; 
    var options = optionsAsString.split("__"); 
    for(var i = 0; i < selects.length; i++) { 
     selects[i].onclick = function() { 
     // clear initally 
     this.innerHTML = ""; 
     var select = this; 
     for(var j = 0; j < options.length; j++) { 
      this.innerHTML += "<option>" + options[j] + "</option>"; 
     } 
     } 
    } 

私はこのことができます願っています。