2015-11-26 63 views
1

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中,当选择一个数值(不是“全部”)时,它有时会返回一个空字符串。 如何处理它?

+5

什么是您尝试使用过的JavaScript代码? – divy3993

回答

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也是它结束前的。

+0

这太好了,但如果我想用此选择序列化表单?我需要让这个选择以正确的方式工作 – Ivan

+0

对不起,我不明白你想说什么。 – divy3993

+0

好吧,我很明白方向来处理这个 – Ivan

-1

你可以试试这个方法来获得选择的项目:

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

这是jQuery,而不是Javascript。 –

0
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; 

};