暂无 |

JavaScript onsubmit 事件

表单被提交时发生时会触发 onsubmit 事件。点击 submit 提交按钮后,onsubmit 事件是先于表单提交发生的,因此可以利用 onsubmit 事件执行一些代码,如表单内容检测等。

下面的例子演示了,在提交表单时,弹出消息确认框进行确认,如果点击否,就不提交表单:

<html>
<head>

<script type="text/javascript">

function checkSubmit(){
    if ( confirm("确认提交表单吗?")){
        var your_name = testform.your_name.value;
        if( your_name == "" ){
            alert("请填写您的名字!");
	    testform.your_name.focus(); 
            return false;
        }
        alert("您好" + your_name + "!");
    } else {
        return false;
    }
}

</script>

</head>
<body>
<form name="testform" onsubmit="return checkSubmit();">
<p>
您的名字:<input type="text" name="your_name" />
<input type="submit" value=" 提交 " />
</p>
</form>
</body>
</html>

您可以在下面试试本例子效果:

您的名字:

语法解释

  1. 表单被提交则触发 onsubmit 事件,checkSubmit() 函数前要加上 return ,否则表单总是会被提交
  2. 例子中通过 confirm 确认框进行表单提交确认
  3. 当检测到没有填写名字时,进行提示并利用 return false 语句阻止表单提交
  4. testform.your_name.focus() 用语在阻止表单提交后,将输入焦点设置到 input 文本输入框,这是开发中系统人性化的一个体现
java教程
php教程
php+mysql教程
ThinkPHP教程
MySQL
C语言
css
javascript
Django教程

发表评论

    评价:
    验证码: 点击我更换图片
    最新评论