表单提交与重置事件

表单提交事件(onsubmit)是在用户提交表单时(通常使用“提交”按钮,也就是将按钮的type属性设为submit),在表单提交之前被触发,因此,该事件的处理程序通过返回false值来阻止表单的提交。该事件可以用来验证表单输入项的正确性。

表单重置事件(onreset)与表单提交事件的处理过程相同,该事件只是将表单中的各元素的值设置为原始值。一般用于清空表单中的文本框。

格式:

<form name="formname" onReset="return Funname" οnsubmit="return Funname"></form>

formname:表单名称。

Funname:函数名或执行语句,如果是函数名,在该函数中必须有布尔型的返回值。

如果在onsubmit和onreset事件中调用的是自定义函数名,那么,必须在函数名的前面加return语句,否则,不论在函数中返回的是true,还是false,当前事件所返回的值一律是true值。

下例是在提交表单时,调用check()函数判断表单元素是否为空,主意一定要将当前表单作为参数传递到check()函数中。然后应用JavaScript编写表单元素是否为空的函数check(),该函数只有一个参数Form,用于指定要进行检查的表单对象,无返回值。程序代码如下。


<form name="form1" method="post" action="">
        <tr align="center">
            <td height="24" colspan="2"><span class="style1">验证表単元素是否内为空</ span></td>    

        </tr>

        <tr align="center">
            <td height="22" colspan="2" class="style1">博客文章评论<td>

       </tr>

        <tr>

            <td width="77" height="22" align=center" class="style1">评论主題:</td>

            <td width="267"><input name="text" type="text" id="text" size="25" maxlength="80"></td>

        </tr>

        <tr>

            <td align="center" class=" style1">评论内容:</td>
            <td><textarea name="textarea" cols="31" rows="5"></textarea></td>
        </tr>
        <tr>
            <td align="center">anbsp;</td>
            <td><input type="submit" name="Submit" value=" 提交" onClick="check (form1) ;">
            <input type="reset" name= "Submit2"  value="重置"></td>
        </tr>
 </ form>

<script language="javascript">

//检查表単元素是否内空

function check (Form) {
for (i=0;i<Form. length;i++){
                                                                    //Form的属性elements的首字e要小写
    if(Form. elements[i].value ==""){
        alert (Form.elements[i]-name + "不能为空!");
                                                        //指定表単元素获得焦点
        Form. elements[i].focus() ;

        return;

}

}

Form. submit();

}

</script>

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值