JavaScript与 HTML表单的交互过程，想要学习动态网页但是无从下手的新手看看。

txf2004

浏览: 6887103 次
性别:
来自: 上海

最近访客更多访客>>

east_java

u012363178

wangyy

GDGZWQZ

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

最近开始了 java web的学习在学习中学到了很多有用的东西比如说 html 表单如何和 javascript进行交互的读完本篇文章后相信初学者会有一个

清晰的理解。。。对应下面的代码看我写的问题。

其实表单的交互操作很简单就是在提交表单数据的时候调用一个 javascript 所写的函数, 注意看我下面所给的代码

这一行 <form name="Form1"onSubmit=" return on_submit() ;"method="post" action="register.jsp" >

注意看阴影地方有一个 onSubmit 属性这里将这个属性设置为return on_submit() ; 意思就是调用 on_submit() 函数

这个函数就在 <script></script> 中定义这就是表单提交的原理,注意我这里只是说表单整体的提交，如果我们想要判断表单中

的某个元素例如 text 也就是文本框的内容是否为空也就是 "" 那么可以这样判断在我们自己写的javascript 函数中

}
</script>

具体细节大同小异 ,基本上有一点html基础的朋友都能看懂这个交互的过程吧,,,,,希望能帮助像我一样的新手。。。写的不好高手不要喷我

对于 html文件表单书写以及事件的响应建议到 Dreamweaver中书写可以有事件提示可以更高效的写程序

<html>
<script language="javascript">
function on_submit()
{

if (Form1.user_name.value == "")
{
alert("用户名不能为空，请输入用户名！");
return false;
}

}
</script>
<head>
<title>this is my first java script page</title>
</head>
<body>用户信息提交
<form name="Form1" onSubmit=" return on_submit() ;" method="post" action="register.jsp" >
用户名: 
<input name="user_name" type="text" maxlength="255" >
<br>
密码:   
<input name="user_password" type="text" maxlength="255" ><br>
出生日期:<input name="year" size="3" maxlength="4" >年<select>
<option selected="selected"> 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>
</select>月<input name="day" size="3" maxlength="4"> <br>
性别:    <input type="radio" name="radio1" >男  <input type="radio" name="radio2">女 <br>
         <input type="submit" name="button_sub" value="提交">  <input type="reset" name="button_reset" value="重置" >
</form>
</body>
</html>