如何将 JavaScript 变量分配给输入文本字段？

发布于 2024-11-06 16:32:09 字数 1285 浏览 0 评论 0原文

我在 javascript 中有一个名为“numbers”的变量，该变量包含从 0 到 9 的 10 个数字，如下所示。

var numbers = "0123456789";

现在我想要做的是使用 document.getElementByID("a") = ""; 将这些数字中的每一个分配给输入文本字段，例如：

<input type="text" id="a" value="" />
<input type="text" id="b" value="" />
<input type="text" id="c" value="" />
<input type="text" id="d" value="" />
<input type="text" id="e" value="" />
<input type="text" id="f" value="" />
<input type="text" id="g" value="" />
<input type="text" id="h" value="" />
<input type="text" id="i" value="" />
<input type="text" id="j" value="" />

目前上面的以下文本字段没有值，但我想要能够将变量“number”中的每个数字分配给上面的每个文本字段，因此当用户单击名为“click me”的按钮时，它看起来像这样。

<input type="text" id="a" value="0" />
<input type="text" id="b" value="1" />
<input type="text" id="c" value="2" />
<input type="text" id="d" value="3" />
<input type="text" id="e" value="4" />
<input type="text" id="f" value="5" />
<input type="text" id="g" value="6" />
<input type="text" id="h" value="7" />
<input type="text" id="i" value="8" />
<input type="text" id="j" value="9" />

如果特定数字 = 0，还有什么方法可以将文本字段留空吗？

提前致谢:)

原文

I've a variable called "numbers" in javascript and this variables holds 10 numbers from 0 to 9 as shown below.

var numbers = "0123456789";

Now what I want to be able to do is assigning each of these numbers to an input text field using document.getElementByID("a") = "";, for example:

<input type="text" id="a" value="" />
<input type="text" id="b" value="" />
<input type="text" id="c" value="" />
<input type="text" id="d" value="" />
<input type="text" id="e" value="" />
<input type="text" id="f" value="" />
<input type="text" id="g" value="" />
<input type="text" id="h" value="" />
<input type="text" id="i" value="" />
<input type="text" id="j" value="" />

Currently the following text fields above holding no values, but I want to be able to assign each of the numbers in variable "numbers" to each of the text fields above, so it would looks like this when user clicks on a button called click me.

<input type="text" id="a" value="0" />
<input type="text" id="b" value="1" />
<input type="text" id="c" value="2" />
<input type="text" id="d" value="3" />
<input type="text" id="e" value="4" />
<input type="text" id="f" value="5" />
<input type="text" id="g" value="6" />
<input type="text" id="h" value="7" />
<input type="text" id="i" value="8" />
<input type="text" id="j" value="9" />

Also is there any way to leave a text field empty if a particular number is = 0

Thanks in advance :)

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

如果没结果 2024-11-13 16:32:09

var numbers = "0123456789";
var ids = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j"];

for (var i = 0; i < ids.length; i++)
{
    var el = document.getElementById(ids[i]);
    var num = numbers[i];

    if (num == "0")
        el.value = "";
    else
        el.value = num;
}

工作示例：http://jsfiddle.net/LrJ5S/。

var numbers = "0123456789";
var ids = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j"];

for (var i = 0; i < ids.length; i++)
{
    var el = document.getElementById(ids[i]);
    var num = numbers[i];

    if (num == "0")
        el.value = "";
    else
        el.value = num;
}

Working sample: http://jsfiddle.net/LrJ5S/.

回复收藏 0 原文

吃→可爱长大的 2024-11-13 16:32:09

除了 mellamob 之外，还有另一种方法可以实现相同的目的：

var numbers = "abc0123abc0123";
var inputs = document.getElementsByTagName('input');
var i = 0;
for(var s = 0; s < inputs.length; s++) {
    inputs[s].value = numbers.charAt(i)!=0?numbers.charAt(i):'';
    i++;
}

JSFiddle

In addition to mellamokb, another way of accomplishing the same:

var numbers = "abc0123abc0123";
var inputs = document.getElementsByTagName('input');
var i = 0;
for(var s = 0; s < inputs.length; s++) {
    inputs[s].value = numbers.charAt(i)!=0?numbers.charAt(i):'';
    i++;
}

JSFiddle

回复收藏 0 原文

怪我闹别瞎闹 2024-11-13 16:32:09

不检查输入和字符串的数据大小的基本示例：

<!DOCTYPE html>
<html>
  <head>
    <meta charset=utf-8 />
    <title></title>
  </head>
  <body>
    <div id="myInputs">
      <input type="text" id="a" value="" />
      <input type="text" id="b" value="" />
      <input type="text" id="c" value="" />
      <input type="text" id="d" value="" />
      <input type="text" id="e" value="" />
      <input type="text" id="f" value="" />
      <input type="text" id="g" value="" />
      <input type="text" id="h" value="" />
      <input type="text" id="i" value="" />
      <input type="text" id="j" value="" />      
    </div>
    <button id="run">Run</button>

    <script type="text/javascript">
        function putNumbers(){
           var numbers = "0123456789";
           var inputs = document.getElementById("myInputs").getElementsByTagName("input");
           for(var i=0;i<inputs.length;i++){
             var val = numbers.charAt(i);
             inputs[i].value = val==="0"?"":val;
           }  

        }

        document.getElementById("run").onclick = putNumbers;
    </script>


  </body>
</html>

工作示例

Basic example with no checks on data size of inputs and string:

<!DOCTYPE html>
<html>
  <head>
    <meta charset=utf-8 />
    <title></title>
  </head>
  <body>
    <div id="myInputs">
      <input type="text" id="a" value="" />
      <input type="text" id="b" value="" />
      <input type="text" id="c" value="" />
      <input type="text" id="d" value="" />
      <input type="text" id="e" value="" />
      <input type="text" id="f" value="" />
      <input type="text" id="g" value="" />
      <input type="text" id="h" value="" />
      <input type="text" id="i" value="" />
      <input type="text" id="j" value="" />      
    </div>
    <button id="run">Run</button>

    <script type="text/javascript">
        function putNumbers(){
           var numbers = "0123456789";
           var inputs = document.getElementById("myInputs").getElementsByTagName("input");
           for(var i=0;i<inputs.length;i++){
             var val = numbers.charAt(i);
             inputs[i].value = val==="0"?"":val;
           }  

        }

        document.getElementById("run").onclick = putNumbers;
    </script>


  </body>
</html>

working Example

回复收藏 0 原文

~没有更多了~