Html 我无法获得数据列表中输入的值?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18249758/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
I can't get the value of a input within a datalist?
提问by Jacques Koekemoer
I have a datalist box that looks like this:
我有一个如下所示的数据列表框:
<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>
and I have a JavaScript code which has to get the value from this datalist.
我有一个 JavaScript 代码,它必须从这个数据列表中获取值。
I tried all the following things to get the value
我尝试了以下所有方法来获得价值
document.getElementById('screens.screenid').value
document.getElementById('screens.screenid').text
document.getElementById('screens.screenid').innerHTML
document.getElementById('screens.screenid').option
and it just does not seem to work.
它似乎不起作用。
Is there something wrong with my JavaScript or with my HTML code?
我的 JavaScript 或 HTML 代码有问题吗?
when I use the console to get the value:
当我使用控制台获取值时:
采纳答案by The Dark Knight
Took sometime to figure this out. Look at my code below :
花了一些时间才弄清楚这一点。看看我下面的代码:
function validate(){
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);
}
<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>
<a href='#' onclick="validate">validate</a>
Now the first one will get the value
as expected, but the text
option
will not work for the obvious reason that you do not have text here. Also, innerHTML
will get you the child html and not the value. Further more , you can't get innerHTML
of an input list, but you can get it for the datalist.
现在第一个将获得value
预期的结果,但由于text
option
您在此处没有文本的明显原因,它将无法正常工作。此外,innerHTML
会为您提供子 html 而不是值。此外,您无法获得innerHTML
输入列表,但可以为数据列表获得它。
Try this : console.log(document.getElementById('screens.screenid-datalist').innerHTML);
尝试这个 : console.log(document.getElementById('screens.screenid-datalist').innerHTML);
I tried it and got the innerHTML
without any hassle :
我试过了,innerHTML
没有任何麻烦:
<option value="Login"></option>
<option value="ScreenCreator"></option>
Find the bin here : http://jsbin.com/inigaj/1/edit
在这里找到垃圾箱:http: //jsbin.com/inigaj/1/edit