Question

我的js文件

function myFunction() {

var component = (document.getElementById("component").value);

var author = (document.getElementById("author").value);

var version = (document.getElementById("version").value);

var changelog = (document.getElementById("changelog").value);

if (component == "" || author == "" || version == "" || changelog == "") {

alert("Please Fill All Fields");

} else {

    alert("submission Completed");

}}

我的HTML文件

<form>

      <h2>Insert Component:</h2>

      <input id="component" type = "text" placeholder = "New Component">

      <h2>Author:</h2>

      <input id="author" type = "text" placeholder = "Author Name">  

      <h2>Version:</h2>

      <input id="version" type = "text" placeholder = "New Version">

      <h2>Changelog:</h2>

      <input id="changelog" type = "text" placeholder = "">
      <br>
      <br>
      <h1><input style="width:100px;height:30px;font-size: 20" name="submit" type = "button" onclick="myFunction()" value="Submit"></h1>

      </form>

如果我完成所有表单字段，第二个警报未显示，则始终显示第一个...有人可以帮助我吗？我真的无法理解

Answer 1

问题是因为在代码中：

linkToAnchor.onclick = function(e) {
  e.preventDefault();
  // ..
};

ID为组件

并在您使用的代码中：的元器件注意资本 C 。所有元素都是如此。所以你实际上永远不会进入if语句

<强>更新：

您还需要从代码中删除所有（）：

<input id="component" type = "text" placeholder = "New Component">

并将它们转换为：

(document.getElementById("component").value);

document.getElementById("component").value;

Answer 2

您的代码工作正常，但仍有一些观察结果：

无需使用 ( ＆amp;获取输入值时 ) 。
您可以使用==而不是使用!，而无需比较值。

使用if (!component || !author || !version || !changelog) { ... }代替if (component == "" || author == "" || version == "" || changelog == "") { ... }

<强>样本

＆＃13;

function myFunction() {
var component = document.getElementById("component").value;

var author = document.getElementById("author").value;

var version = document.getElementById("version").value;

var changelog = document.getElementById("changelog").value;

if (!component || !author || !version || !changelog) {

alert("Please Fill All Fields");

} else {

    alert("submission Completed");

}
};

＆＃13;

<form>

      <h2>Insert Component:</h2>

      <input id="component" type = "text" placeholder = "New Component">

      <h2>Author:</h2>

      <input id="author" type = "text" placeholder = "Author Name">  

      <h2>Version:</h2>

      <input id="version" type = "text" placeholder = "New Version">

      <h2>Changelog:</h2>

      <input id="changelog" type = "text" placeholder = "">
      <h1><input style="width:100px;height:30px;font-size: 20" name="submit" type = "button" onclick="myFunction()" value="Submit"></h1>
      </form>

＆＃13;

Answer 3

使用正确的ID（组件，作者，版本，更改日志）来实现预期结果

var component = (document.getElementById("component").value);

var author = (document.getElementById("author").value);

var version = (document.getElementById("version").value);

var changelog = (document.getElementById("changelog").value);

Codepen - http://codepen.io/nagasai/pen/JWKyjX for referece

在正确的ID

之后，这两个警报都会起作用

问题：

由于ID值不正确，字段的值始终为空，因此每次只获得第一个警报。

警告javascript如果循环不工作

3 个答案: