警报如果周期

Question

我JS的JavaScript不工作的文件

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

的问题是，因为在代码：

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

id为组件

，并在代码使用的是： 组件 的通知首都C。 对于所有元素也是如此。 所以你实际上是永远不会进入if语句

更新：

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

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

并将其转换为：

document.getElementById("component").value; 

<script> 
 
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"); 
 

 
}} 
 
</script> 
 

 
<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 2

使用正确ids-（组件，作者，版本，更新日志），以达到预期的结果

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为referece正确的ID后

两个警报也将工作

问题：

由于id值不正确，字段的值始终为空，因此您正在开始每次只有第一次警报。

Answer 3

您的代码工作正常，但仍然有一些意见：

• 没有必要使用( & )而获得的输入值。
• 而不是使用==您可以使用!比较没有价值。

使用if (!component || !author || !version || !changelog) { ... }，而不是if (component == "" || author == "" || version == "" || changelog == "") { ... }

在你的js代码DEMO

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"); 
 

 
} 
 
};

<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>