我不知道为什么javascript不起作用。不显示警报消息。这是一个简单的html文件,用于验证用于将书籍添加到数据库的表单。在点击提交按钮时,页面会将自己定向到以下链接,而不会延迟警报窗口。请帮助我。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Add Book</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/default.css" />
</head>
<body id="index_page">
<div id="wrapper">
<div id="header">
<h1 align="left">Library</h1>
</div>
<ul id="navigation">
<li id="index"><a href="http://localhost/UID/FAQ.php">FAQ</a></li>
</ul>
<div id="content">
<div id="main_content">
<h2>Add book</h2>
<h4>Enter details of the book</h4>
<FORM action="add_book_action.php" method="post" >
<TABLE WIDTH="50%" >
<TR>
<TH width="50%">Book ID:</TH>
<TD width="50%"><INPUT TYPE="text" name="id" id="book_id"></TD>
</tr>
<TR>
<TH width="50%">Book Name:</TH>
<TD width="50%"><INPUT TYPE="text" name="name" id="book_name"></TD>
</tr>
<TR>
<TH width="50%">Book Author:</TH>
<TD width="50%"><INPUT TYPE="text" NAME="author" id="book_author"></TD>
</tr>
<TR>
<TH width="50%">Year of Publication:</TH>
<TD width="50%"><INPUT TYPE="text" NAME="pub" id="book_year"></TD>
</tr>
<TR>
<TH></TH>
<TD width="50%"><INPUT TYPE="submit" Value="Submit" onclick="return validate_fun()"></TD>
</tr>
</TABLE>
</FORM>
</div>
<p id="footer"><a href="http://localhost/UID/UID.php">@AntonyAjay,2012</a></p>
</div>
<script language="javascript">
function validate_fun()
{
var x=document.getElementById("book_id").value;
if(x==""||isNaN(x))
{
alert("Book Id should be numeric");
return false;
}
var x=document.getElementById("book_name").value;
var regex = /^[a-zA-Z ]*$/;
if(!(regex.test(x)))
{
alert("Book Name should be only characters and spaces");
return false;
}
var x=document.getElementById("book_author").value;
var regex = /^[a-zA-Z ]*$/;
if(!(regex.test(x)))
{
alert("Author Name should be only characters and spaces");
return false;
}
}
var x = document.getElementById("book_year").value;
var regExp = /^([1][6-9][0-9][0-9]|[2][0][01][0-9]\/|-([1-9]|[1][0-9]|[2][0-9]|[3][01])\/|-([1-9]|[1][012])$/;
if(!(regExp.test(x)))
{
alert("Enter date in yyyy-mm-dd format");
return false;
}
}
</script>
</body>
</html>
答案 0 :(得分:2)
除了额外的}
之外,您的代码缺少关闭<div #wrapper>
,此RegExp也有一个无对齐的括号:
var regExp = /^([1][6-9][0-9][0-9]|[2][0][01][0-9]\/|-([1-9]|[1][0-9]|[2][0-9]|[3][01])\/|-([1-9]|[1][012])$/;
使用浏览器的开发工具时,所有这些都可以在两秒内找到...
答案 1 :(得分:0)
正如大家已经建议的那样,请使用任何现代浏览器中的开发者工具,它将能够告诉你更多。如果您仍在努力,修改下面的代码,但这些都是愚蠢的错误,所以请确保您有一个IDE可以进行缩进并检查丢失或额外的大括号。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Add Book</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/default.css" />
</head>
<body id="index_page">
<div id="wrapper">
<div id="header">
<h1 align="left">Library</h1>
</div>
<ul id="navigation">
<li id="index"><a href="http://localhost/UID/FAQ.php">FAQ</a></li>
</ul>
<div id="content">
<div id="main_content">
<h2>Add book</h2>
<h4>Enter details of the book</h4>
<FORM action="add_book_action.php" method="post" >
<TABLE WIDTH="50%" >
<TR>
<TH width="50%">Book ID:</TH>
<TD width="50%"><INPUT TYPE="text" name="id" id="book_id"></TD>
</tr>
<TR>
<TH width="50%">Book Name:</TH>
<TD width="50%"><INPUT TYPE="text" name="name" id="book_name"></TD>
</tr>
<TR>
<TH width="50%">Book Author:</TH>
<TD width="50%"><INPUT TYPE="text" NAME="author" id="book_author"></TD>
</tr>
<TR>
<TH width="50%">Year of Publication:</TH>
<TD width="50%"><INPUT TYPE="text" NAME="pub" id="book_year"></TD>
</tr>
<TR>
<TH></TH>
<TD width="50%"><INPUT TYPE="submit" Value="Submit" onclick="return validate_fun()"></TD>
</tr>
</TABLE>
</FORM>
</div>
<p id="footer"><a href="http://localhost/UID/UID.php">@AntonyAjay,2012</a></p>
</div>
<script language="javascript">
function validate_fun()
{
var x=document.getElementById("book_id").value;
if(x==""||isNaN(x))
{
alert("Book Id should be numeric");
return false;
}
var x=document.getElementById("book_name").value;
var regex = /^[a-zA-Z ]*$/;
if(!(regex.test(x)))
{
alert("Book Name should be only characters and spaces");
return false;
}
var x=document.getElementById("book_author").value;
var regex = /^[a-zA-Z ]*$/;
if(!(regex.test(x)))
{
alert("Author Name should be only characters and spaces");
return false;
}
var x = document.getElementById("book_year").value;
var regExp = /^([1][6-9][0-9][0-9]|[2][0][01][0-9]\/|-([1-9]|[1][0-9]|[2][0-9]|[3][01])\/|-([1-9]|[1][012])$/;
if(!(regExp.test(x)))
{
alert("Enter date in yyyy-mm-dd format");
return false;
}
}
</script>
</body>
</html>