Javascript dropdown issue

Question

我有這4個下拉菜單，我將用它來在我的網站上設置高級搜索。我不是一個JavaScript程序員，所以我需要一個幫助來僞裝代碼。我爲我的4字段分割了4次代碼，但是我有一個錯誤，一個變量覆蓋了之前設置的其他3個。有一個簡單的簡單方法可以做到我需要的一半代碼。這是我的環境http://jsfiddle.net/4K7L7/3/

function DropDown(el) { 
     this.dd = el; 
     this.placeholder = this.dd.children('span'); 
     this.opts = this.dd.find('ul.dropdown > li'); 
     this.val = ''; 
     this.index = -1; 
     this.initEvents(); 
    } 
DropDown.prototype = { 
    initEvents : function() { 
     var obj = this; 

     obj.dd.on('click', function(event){ 
      $(this).toggleClass('active'); 
      return false; 
     }); 

     obj.opts.on('click',function(){ 
      var opt = $(this); 
      obj.val = opt.text(); 
      obj.index = opt.index(); 
      obj.placeholder.text('Tipo: ' + obj.val); 
     }); 
    }, 
    getValue : function() { 
     return this.val; 
    }, 
    getIndex : function() { 
     return this.index; 
    } 
} 

$(function() { 

    var dd = new DropDown($('#dd')); 

    $(document).click(function() { 
     // all dropdowns 
     $('.wrapper-dropdown-1').removeClass('active'); 
    }); 

}); 

Answer 1

您的代碼似乎沒問題。你只需要爲每個元素創建一個實例，就像這樣：

var dd = new DropDown($('#dd')), 
    cc = new DropDown($('#cc')), 
    bb = new DropDown($('#bb')), 
    aa = new DropDown($('#aa')); 

或者添加一個「DD」類所有的元素，然後你可以有：

$('.dd').each(function(){ 
    new DropDown($(this)); 
}); 

無需複製功能......