選擇具有空值

Question

I`ve一個「選擇」：

<select class="date-select2" name="date"> 
    <option selected="selected" value="">All</option> 
    <option value="11-2015">11-2015</option> 
    <option value="10-2015">10-2015</option> 
    <option value="09-2015">09-2015</option> 
    <option value="07-2015">07-2015</option> 
    <option value="06-2015">06-2015</option> 
    <option value="04-2015">04-2015</option> 
    <option value="03-2015">03-2015</option> 
</select> 

當我真的嘗試獲得的選擇值，

document.getElementsByClassName('date-select2')[0].value 

它通常返回所選項目的值鉻。在FF和Safari中，當選擇一個數值（不是「全部」）時，它有時會返回一個空字符串。 如何處理它？

Answer 1

我想這可能會幫助您：

HTML

<select class="date-select2" name="date" onchange="myFunction(this.value)"> 
    <option selected="selected" value="">All</option> 
    <option value="11-2015">11-2015</option> 
    <option value="10-2015">10-2015</option> 
    <option value="09-2015">09-2015</option> 
    <option value="07-2015">07-2015</option> 
    <option value="06-2015">06-2015</option> 
    <option value="04-2015">04-2015</option> 
    <option value="03-2015">03-2015</option> 
</select> 

的JavaScript

function myFunction(curValue) { 
    alert(curValue); 
} 

Working : Fiddle

注：還記得把你的JavaScript代碼裏面body也是它結束前的。

Answer 2

你可以試試這個方法來獲得選擇的項目：

$(".date-select2 option:selected").text(); 

Answer 3

var select = document.querySelector('select.date-select2'); 

// add onchange handler 
select.onchange = function(){ 
var idx = select.selectedIndex; 

var val = select.options[idx].value; 
// if All is selected use text of option 
    if(val=="") 
    val = select.options[idx].textContent; 

};