Question

我只想在我的网页上使用HTML表单和输入标签创建一个文本框，并且能够让页面上的Javascript使用输入的值。我的HTML看起来像这样：

<div id="firstq"> 
<form id="firstbox">
    Choice: <input id="firstinput" type="text" name="choice">
</form>
</div>

我试图使用的Javascript看起来像这样：

var topMenuChoice = document.getElementById("firstinput");
    document.write(topMenuChoice);
}

但是，我在文本框下面的网页上看到的只是“[object HTMLInputElement]”。我该怎么做才能让它正常工作？

由于

Answer 1

请参阅http://www.w3schools.com/jsref/prop_text_value.asp

var htmlInputElementObjet = document.getElementById("firstinput");
document.write(htmlInputElementObjet.value);

<div id="firstq"> 
<form id="firstbox">
    Choice: <input id="firstinput" type="text" name="choice" value="initial value">
</form>
</div>

Answer 2

使用value属性

var topMenuChoice = document.getElementById("firstinput");
    document.write(topMenuChoice).value;
}

Answer 3

这是一个change事件监听器的示例，用于在form

中发生更改时触发函数

＆＃13;

var div = document.querySelector('div');
var topMenuChoice = document.getElementById("firstinput");
topMenuChoice.addEventListener('change',function(e){
div.innerHTML = e.target.value/***e.target.value is your input***/


var divInner = div.innerHTML;
setTimeout(function(){
 document.write(divInner);
},2000)

})

＆＃13;

<form id="firstbox">Choice:
  <input id="firstinput" type="text" name="choice" value=66>
</form>
<div>look here!!</div>

＆＃13;

Answer 4

检查一下！

document.write(document.forms['firstbox'].firstinput.value);

OR

var topMenuChoice = document.getElementById("firstinput");
    document.write(topMenuChoice.value);
}

Answer 5

如果要在输入中输入文本，则需要使用元素的<div id="imgslide" />属性。您还可以使用另一个HTML标记来显示结果（避免使用document.write）：

<强> HTML

value

<强> JS

<div id="firstq"> 
  <form id="firstbox">
    Choice: <input id="firstinput" type="text" name="choice">
  </form>
  <div id="result"></div>
</div>

您必须考虑使用事件（点击，按键）来控制检索输入值的确切时刻。

<强> JS

var topMenuChoice = document.getElementById("firstinput");
document.getElementById("result").innerHTML = topMenuChoice.value;

如何从Javascript中的HTML文本框中获取价值

5 个答案: