html中的javascript无法进行表单验证
html中的javascript无法进行表单验证
提问于 2015-12-11 15:18:30
我已经尝试了所有的方法，但是表单验证javascript仍然不能在我的html文档中工作。有人能告诉我这里出了什么问题吗?因为我找不到它。
这是下面显示的javascript和html代码，以显示我做得正确，但它仍然不起作用。
<script type="text/javascript" language="javascript">
function validateForm() {
var fname = document.getElementById("firstname").value;
var lname = document.getElementById("lastname").value;
var month = document.getElementById("month").value;
var day = document.getElementById("day").value;
var year = document.getElementById("year").value;
var bio = document.getElementById("bio").value
if (fname == null || fname == ""){
alert("Firstname not filled out.");
return false;
}
if (lname == null || lname == ""){
alert("Lastname not filled out");
return false;
}
if (month == null || month == ""){
alert("Birthday not filled out");
return false;
}
if (day == null || day == ""){
alert("Birthday not filled out");
return false;
}
if (year == null || year == ""){
alert("Birthday not filled out");
return false;
}
if (bio == null || bio == ""){
alert("About me not filled out");
return false;
}
}
</script>
<form class="form-horizontal" method="POST" action="userinfo" name="update" onsubmit="return validateForm()">
<div class="form-group">
<label class="control-label col-sm-3">First Name:</label>
<div class="col-xs-5">
<input type="text" class="form-control" name="firstname" id="firstname"></input>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">Last Name:</label>
<div class="col-xs-5">
<input type="text" class="form-control" name="lastname" id="lastname"></input>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">Email:</label>
<div class="col-xs-5">
<input type="email" class="form-control" name="email" id="email"></input>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">Sex:</label>
<label class="radio-inline"><input type="radio" name="optradio">Male</label>
<label class="radio-inline"><input type="radio" name="optradio">Female</label>
</div>
<div class="form-group">
<label class="control-label col-sm-3">Status:</label>
<div class="col-xs-4">
<select class="form-control" name="stat">
<option></option>
<option>Single</option>
<option>In a relationship</option>
<option>Married</option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">Birthday:</label>
<div class="col-xs-3">
<select class="form-control" name="month">
<option></option>
<option>January</option>
<option>Febuary</option>
<option>March</option>
<option>April</option>
<option>May</option>
<option>June</option>
<option>July</option>
<option>August</option>
<option>September</option>
<option>October</option>
<option>November</option>
<option>December</option>
</select>
</div>
<div class="col-xs-2">
<select class="form-control" name="day">
<option></option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
<option>23</option>
<option>24</option>
<option>25</option>
<option>26</option>
<option>27</option>
<option>28</option>
<option>29</option>
<option>30</option>
<option>31</option>
</select>
</div>
<div class="col-xs-2">
<select class="form-control" name="year">
<option></option>
<option>2015</option>
<option>2014</option>
<option>2013</option>
<option>2012</option>
<option>2011</option>
<option>2010</option>
<option>2009</option>
<option>2008</option>
<option>2007</option>
<option>2006</option>
<option>2005</option>
<option>2004</option>
<option>2003</option>
<option>2002</option>
<option>2001</option>
<option>2000</option>
<option>1999</option>
<option>1998</option>
<option>1997</option>
<option>1996</option>
<option>1995</option>
<option>1994</option>
<option>1993</option>
<option>1992</option>
<option>1991</option>
<option>1990</option>
<option>1989</option>
<option>1988</option>
<option>1987</option>
<option>1986</option>
<option>1985</option>
<option>1984</option>
<option>1983</option>
<option>1982</option>
<option>1981</option>
<option>1980</option>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">About Me:</label>
<div class="col-xs-5">
<textarea class="form-control" rows="3" name="bio" id="bio"></textarea><br>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">Stack Overflow用户
发布于 2015-12-11 15:31:51
所有的html选择都设置了错误的属性Try：
<select class="form-control" name="month">
set to :
<select class="form-control" id="month">页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/34218054
复制相关文章
相似问题
腾讯云开发者
