не может получить значение входа с DataList

У меня есть окно DataList который выглядит следующим образом:не может получить значение входа с DataList

<td> 
    <input list="screens.screenid-datalist" type="text" id="screens.screenid" onblur="validate('0','0','jacques')"> 
    <datalist id="screens.screenid-datalist"> 
     <option value="Login"></option> 
     <option value="ScreenCreator"></option> 
    </datalist> 
    <label id="val-screens.screenid" class="Label_Error" style="visibility: hidden;">*</label> 
</td>

и у меня есть код JavaScript, который должен получить значение из этого DataList.

Я попытался все следующие вещи, чтобы получить значение

document.getElementById('screens.screenid').value 
document.getElementById('screens.screenid').text 
document.getElementById('screens.screenid').innerHTML 
document.getElementById('screens.screenid').option

, и он просто не похоже на работу.

Что-то не так с моим JavaScript или с моим кодом HTML?

, когда я использую консоль, чтобы получить значение: when I use the console to get the value

источник

2013-08-15 Jacques Koekemoer

отлично работает для меня (см Http: // jsfiddle .net/Uz2ak /) - чтобы выбрать элемент из datalist в элементе 'type = text', я должен начать вводить его и выбрать его из меню или нажать стрелку вниз в Chrome 28. – shanet

' document.getElementById ('screens.screenid'). value' works fo r me too (Chrome 30, IE 10 и FF 22). – Harry

@Jacques вы можете предоставить больше контекста этому коду? Возможно ли, что ваш скрипт работает до того, как DOM готов, например? – shanet

Взял когда-нибудь, чтобы понять это. Посмотрите на мой код ниже:

HTML:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset=utf-8 /> 
<title>JS Bin</title> 
</head> 
<body> 
    <input list="screens.screenid-datalist" type="text" id="screens.screenid" onblur="validate('0','0','jacques')"> 
    <datalist id="screens.screenid-datalist"> 
     <option value="Login"></option> 
     <option value="ScreenCreator"></option> 
    </datalist> 
    <label id="val-screens.screenid" class="Label_Error" style="visibility: hidden;">*</label> 
</body> 
</html>

Javascript:

function validate(id, id1, text){ 
console.log(document.getElementById('screens.screenid').value); //WORKS 

console.log(document.getElementById('screens.screenid').text); 
console.log(document.getElementById('screens.screenid').innerHTML); 
console.log(document.getElementById('screens.screenid').option); 

}

Теперь первый из них будет получить value, как и ожидалось, но textoption не будет работать по той очевидной причине, что у вас нет текста здесь. Кроме того, innerHTML доставит вам дочерний html, а не значение. Кроме того, вы не можете получить innerHTML входного списка, но вы можете получить его для datalist.

Попробуйте это: console.log(document.getElementById('screens.screenid-datalist').innerHTML);

Я попробовал и получил innerHTML без каких-либо хлопот:

<option value="Login"></option> 
<option value="ScreenCreator"></option>

Найти бункер здесь: http://jsbin.com/inigaj/1/edit

источник

2013-08-15 09:38:11

Я добавил скриншот консоли, по какой-то причине он, похоже, не работает для меня –

@Jacques Создан ли ваш список входных данных динамически? –

да, я использую php для формирования ввода и datalist –

не может получить значение входа с DataList

ответ

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