2015-07-10 3 views
-2

У меня есть два раскрывающихся меню с указанием даты и времени соответственно. Я хочу получить текст из тега параметра, когда я нажимаю кнопку, но функция javascript, похоже, не работает. Я нашел похожие вопросы (и ответы) об этом, но ничего не получилось. Код приведен ниже:Получить текст из тега select в html

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript"> 
function collectData() { 
    var index = document.getElementById("date").selectedIndex; 
    var date = document.getElementById("date").options[index].text; 
    window.alert("You selected: " + date); 
} 
</script> 
</head> 
<body> 
    <select name="date"> 
    <option value="1">date 1</option> 
    ..... 
    </select> 

    <select name="time"> 
    <option value="1">time 1</option> 
    ..... 
    </select> 

    <button type="button" onclick="collectData()">Get data</button> 
</body> 
</html> 

ответ

2

Вы выбираете элемент по идентификатору, но вы не назначали его нигде.

Вам нужно добавить правильный идентификатор элемента:

<select id="date" name="date"> 
.... 
<select id="time" name="time"> 

Или вы можете выбрать элементы по имени:

var index = document.getElementsByName("date")[0].selectedIndex; 

Примечание: getElementsByName возвращает массив, вот почему [0] был добавлен для выбора первого элемента с таким именем.

0

Изменить код

<!DOCTYPE html> 
    <html> 
    <head> 
    <script type="text/javascript"> 
    function collectData() { 
     var e = document.getElementById("date"); 
     var strUser = e.options[e.selectedIndex].value; 
     window.alert("You selected: " + strUser); 
    } 
    </script> 
    </head> 
    <body> 
     <select name="date" id="date"> 
     <option value="1">date 1</option> 
.. 

     </select> 

     <select name="time"> 
.. 
     </select> 

     <button type="button" onclick="collectData()">Get data</button> 
    </body> 
    </html> 
0

вы используете getElementById('date') .so добавить атрибут ID, чтобы выбрать элемент.

0

Попробуйте это:

function collectData() {  
 
    var ddl = document.getElementById("dateSelect"); 
 
    var text = ddl.options[ddl.selectedIndex].text; 
 
    window.alert("You selected: " + text); 
 
}
<select id="dateSelect" name="date"> 
 
    <option value="1">date 1</option> 
 
    <option value="2">date 2</option> 
 
    <option value="3">date 3</option> 
 
</select> 
 
<button type="button" onclick="collectData()">Get data</button>

Здесь CodePen

Смежные вопросы