2

我在外部 js 文件中构建了函数，我正在尝试创建一个按钮来运行该函数，然后将结果插入到文本框中。我已经把头撞到墙上几个小时了，我觉得我有点接近了。

HTML 代码：

<label for="fName">First Name </label>
            <input type="text" name="fName" id="fName" /><p>
            <input type="button" value="JS Test" name="button1" onclick="writeHumanName(this.form)" />

JS代码：

function writeHumanName() {
  // Array of my family 
  var humanName = ["Troy", "Beth", "Gabby", "Owen", "Evan"];


document.write("My Family = ");

// Loop through the humanName array
  for (var i = 0; i < humanName.length; i++) {
  document.write(humanName[i]);

}

}

4

3 回答 3

1

更新：

HTML：

<label for="fName">First Name </label>
<input type="text" name="fName" id="fName" />

<p>

<input type="button" value="JS Test" name="button1" onclick="writeHumanName()" />

JS：

function writeHumanName() {
  // Array of my family 
  var humanName = ["Troy", "Beth", "Gabby", "Owen", "Evan"];

  var myString = ("My Family = ");

  // Loop through the humanName array
  for (var i = 0; i < humanName.length; i++) {
    myString += (humanName[i]) + ", ";
  }

  document.getElementById('fName').value = myString;

}

一个工作的codepen： http ://codepen.io/anon/pen/waLLXO

于 2015-08-22T21:11:21.670 回答
1

https://jsfiddle.net/ebkd7sp4/8/

HTML：

<label for="fName">First Name </label>
<input type="text" name="fName" id="fName" />
<input type="button" value="JS Test" name="button1" onclick="writeHumanName()" />

JS：

function writeHumanName() {
  // Array of my family 
  var humanName = ["Troy", "Beth", "Gabby", "Owen", "Evan"];

  var text = "My Family = " + humanName.join(", ");

  document.getElementById("fName").value = text  
}

无需将任何内容传递给您的函数。您可以使用该join()命令来避免循环。用于document.getElementById("fName").value操作文本框中的文本。

于 2015-08-22T21:19:27.937 回答
0

您是否在索引页面中包含了 js 文件？

<head>
  <meta charset="utf-8">
  <title>Hello world</title>

  <!-- scripts -->
  <script src="js/file1.js"></script> <!-- include files -->
  <script src="js/file2.js"></script>       
</head>

编辑：您似乎是从 html 调用您的函数，如下所示：

writeHumanName(this.form);

this将是窗口对象；您需要从 DOM 中获取 div 并在 JS 中处理它...

function writeHumanName() {

    // Array of my family 
    var humanName = ["Troy", "Beth", "Gabby", "Owen", "Evan"],
        val = document.getElementById('fName').value;

    console.log("My Family = " + val);

    // Loop through the humanName array
    for (var i = 0; i < humanName.length; i++) {
        console.log(humanName[i]);
    }
}
于 2015-08-22T21:00:46.033 回答