JavaScrip——简单练习(输出方式,简单表单验证)

<script>
//输出方式
document.write(Date());//获取当前时间
document.write(1);
document.write("<p>你好</p>");//直接输内容
document.getElementById("nihao").innerHTML;//通过获取id
document.getElementById("nihao").innerHTML="走";
//alert("你好");//alert输出

</script>

<form id="f1" name="f1" onsubmit="return checkform()">
用户名:<input type="text" name="username" value="" />

<input type="submit" value="提交" />
</form> 

<script>
function checkform()
{
    var f11=document.f1.username.value.length;
    if(f11>4)
    {alert("小于4");
     return false;}
    }
</script>

<form onsubmit="return validation()">
    <span>账号</span><input type="text" id="no" /><br>
    <span>密码</span><input type="text" id="pwd" /><br>
    <button type="submit">提交</button>
</form>
<script>
function validation() {
    var no = document.getElementById("no").value;
    var pwd = document.getElementById("pwd").value;
    if(no == "") {
        alert("账号不为空!");
        return false;
    }

if(pwd == "") {
        alert("密码不为空!");
        return false;
    }
}
</script>

<form name=a onsubmit="return test()">
<textarea name="b"  cols="40"  wrap="VIRTUAL" rows="6"></textarea>
<input type="submit" name="Submit" value="check">
</form>
<script>
function test()
{
if(document.a.b.value.length>10)
{
alert("不能超过10个字符!");
document.a.b.focus();
return false;
}
}
</script>

结果:静态

时间: 2024-10-13 11:53:33

JavaScrip——简单练习(输出方式,简单表单验证)的相关文章

简单的jquery代码实现表单验证

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

AngularJS 的表单验证

最近开始学习angularjs,学到表单验证的时候发现有必要学习下大神的好文章: 转:http://www.oschina.net/translate/angularjs-form-validation 今天我们将来看看Angular如何帮助做表单验证. 我们将讨论更多使用angular进行有关表单操作的东西(就像我们另外的一篇文章: 提交Ajax表单:AngularJS的方式). 不过不用担心,那篇文章不一定要读的. 我们将重点放在客户端验证上,并使用Angular内置的表单属性.这里有一个 

Bootstrap+PHP表单验证实例

简单实用的Bootstrap+PHP表单验证实例,非常适合初学者及js不熟悉者,还有ajax远程验证 js验证表单 1 $(document).ready(function() { 2 $('#defaultForm') 3 .bootstrapValidator({ 4 message: 'This value is not valid', 5 feedbackIcons: { 6 valid: 'glyphicon glyphicon-ok', 7 invalid: 'glyphicon g

jQuery Validate【为表单提供了强大的验证功能,让客户端表单验证变得更简单】

jQuery Validate jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证,同时提供了一个用来编写用户自定义方法的 API.所有的捆绑方法默认使用英语作为错误信息,且已翻译成其他 37 种语言. 该插件是由 J?rn Zaefferer 编写和维护的,他是 jQuery 团队的一名成员,是 jQuery UI 团队的主要开发人员,是 QUn

AngularJs的一个简单的表单验证

最近学习了AngularJs框架,觉得确实特别有用.之前学习了一点点的ASP.NET,它的控件也是挺好的,不过还是没有AngularJs轻巧. 定义一个应用程序myApp,一个控制器.接着是表单的验证. AngularJs中,表单控件的HTML元素有:input select button textarea元素 其实还算是很简单的例子. 不过我觉得对比起ASP那种庞大的控件来说,它确实很轻巧. AngularJS 输入验证$dirty 表单有填写记录$valid 字段内容合法的$invalid

如何利用jQuery进行简单表单验证

如何利用jQuery进行简单表单验证:利用jQuery可以进行表单验证,当然有比较复杂的表单验证,这里就不介绍了,下面就简单介绍一下如何使用jQuery进行简单的表单验证,然后大家可以通过改造进行基本的表达验证了.先看一段代码实例: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http

最简单的表单验证

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>最简单表单验证</title> 6 <style> 7 form { margin: 20px auto; width: 500px; padding: 20px; border: 1px solid #ccc; box-sh

简单的JS表单验证效果代码

简单的JS表单验证代码:表单验证几乎是不可缺少的,有的表单验证是在后台完成的,有的则是使用JavaScript在在前端完成基本的验证,这样可以有效的减轻服务器的压力,下面就介绍一下JS实现的最简单的表单验证.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://w

jquery 一个简单的表单验证实例

表单验证在网站开发过程中经常遇到,我们可以使用服务器端语言验证,也可以使用客户端语言来验证.本文章向大家介绍jquery客户端验证表单的一个简单实例.实例仅作参考. <body> <form method="post" action=""> <div class="int"> <label for="username">用户名:</label> <!-- 为每个

当文本框失去焦点即进行表单验证简单实例

当文本框失去焦点即进行表单验证简单实例:不少的表单验证都有这样的功能,就是当鼠标焦点离开文本框的时候,即刻进行合法性验证,下面就通过一个实例简单介绍一下如何实现此功能,代码实例如下: <script type="text/javascript"> function onblurs(){ if(myform.name.value==""){ alert("姓名不得为空!"); } else if(myform.address.value