javascript - 如何将 Javascript 变量传递给 HTML

Question

<script>
   var list_max = 99
</script>

<div>
  <input type="text" data-index="0" name="min" value="1"/>
  <input type="text" data-index="1" name="max" value="list_max"/>
</div>

小提琴：http: //jsfiddle.net/SP5VQ/10/

因此，您在 Javascript 中有一个变量，并且您想将它传递给 HTML 输入的值。你做什么工作？

为了使html代码功能像这样

<input type="text" data-index="0" name="min" value="1"/>
<input type="text" data-index="1" name="max" value="99"/>

Answer 1

将 an 分配id给输入，如下所示：

<input type="text" id="list_max" data-index="1" name="max" />

然后你可以像这样使用 JS 来赋值：

document.getElementById('list_max').value = list_max;

我假设您正在一个函数中运行 JS 代码，该函数将在页面加载后执行。如果没有，请确保在相关 HTML 之后运行它，或者将其包装在window.onload = function() { /* ... */ };.

Answer 2

<input type="text" data-index="1" name="max" id="myElement" />
<script>
   document.getElementById('myElement').value = 99;
</script>

Answer 3

<input type="text" data-index="0" name="min" value="1"/>
<input type="text" data-index="1" id='change_me' name="max" value="99"/>

<script>
var list_max = 99
document.getElementById("change_me").value = list_max ;
</script>

在任何情况下都使用 onload 所以它在页面加载后运行：

http://www.w3schools.com/jsref/event_onload.asp

谷歌是你的朋友。

Answer 4

如果你使用 jQuery

<input type="text" data-index="0" name="min" value="1"/>
<input type="text" data-index="1" id='change_me' name="max" value="99"/>

<script>
var list_max = 99
$('input[name="max"]').val(list_max);
</script>