javascript - 获取html输入标签值

Question

为什么这段代码不起作用？是否需要“id”属性？

<html>
<head>
<script language="JavaScript">
  function pprint(){
   var a = tf.value;
   document.write(a);
     }
 </script>
</head>
<body>
<input type="text" name="tf"  value="Test">
<input type="button" onClick="pprint()" value="print" >
</body>
</html>

谢谢！

score 5 · Accepted Answer

在表单中，name属性需要用 ( , ) 对填充$_POST或$_GET全局变量。namevalue

Javascript 不会仅从名称中识别元素。因此，您最好使用该id属性。

<input type="text" name="tf" id="tf"  value="Test">

而在你的 Javascript 中，你可以直接调用document.getElementById('tf')来获取元素。

像这样的东西。

document.write(document.getElementById('tf').value);

score 2 · Accepted Answer

两个变化。'tf' 是一个 'id' 并获取 javascript 中的元素。还有上面建议的“警报”。

<html>
<head>
<script language="JavaScript">
  function pprint(){
   var tf = document.getElementById('tf');
   var a = tf.value;
   alert(a);
  }
 </script>
</head>
<body>
<input type="text" id="tf"  value="Test">
<input type="button" onClick="pprint()" value="print" >
</body>
</html>

score 1 · Accepted Answer

为什么这段代码不起作用？

Javascript 并没有像您期望的那样为您提供准备好使用的元素句柄。您必须通过其名称、ID、标签名称或通过其父表单（如果有的话）来获取元素。

是否需要“id”属性？

不，不需要 ID 来获取元素的句柄。按名称获取元素的示例：

function pprint(){
    var a = document.getElementsByName("tf")[0].value;
    console.log(a);
}

score 1 · Accepted Answer

在使用 JavaScript 时，如果你想访问任何元素，你可以选择使用：

document.getElementById (id)
document.getElementByName]（名称）

您可以使用以下代码：

<script language="JavaScript">
  function pprint(){
    // If you want to use element Id
      var a = document.getElementById('tf').value;
      document.write(a);
    // If you want to access by element name
      var b = document.getElementsByName('tf')[0].value;
      document.write(b);
 }
 </script>

JsFiddle 上的工作演示

javascript - 获取html输入标签值

4 回答 4

Related

Reference