下拉currentIndex onchange

Question

有5个选项的下拉列表.目前,选择了选项2.用户现在选择选项4. onchange事件被触发,它被一个JS函数捕获,用于监听select上的onchange.

在JS函数中,我可以使用selectedIndex属性轻松检查用户选择的选项的索引.但是,我还想知道用户更改它的原始值是什么.

是否存在基本上保持原始值的属性,即在这种情况下的选项2.

Answer 1

正如我将以下内容放在一起的概念 - 可能有更好的方法来做到这一点:

var vals = [];

document.getElementById("colors").onchange = function(){
   vals.unshift(this.selectedIndex);
};

function getPrevious(){
  alert(vals[1]); // you'll need more logic here
                  // this is purposefully simplistic
}

-

<select id="colors">
   <option>Red</option>
   <option>Green</option>
   <option>Blue</option>
</select>

封闭示例:

我试图把这一切都绑定到实际的下拉元素本身.老实说,这是我第一次在下拉列表中添加函数,所以我不能保证这不会产生后果:

   var colors = document.getElementById("colors");
       colors.vals = [];
       colors.setPrevious = function() { this.vals.unshift(this.selectedIndex); }
       colors.getPrevious = function() { return this.vals[1]; }
       colors.onchange    = function() { this.setPrevious(); this.getPrevious(); }
       // set initial state
       colors.setPrevious();