<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<script>

function validateForm() {

    var x = document.forms["myForm"]["fname"].value;

    if (x == null || x == "") {

        alert("需要输入名字。");

        return false;

    }

}

</script>

</head>

<body>

<form name="myForm" action="demo_form.php"

onsubmit="return validateForm()" method="post">

名字: <input type="text" name="fname">

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

</form>

</body>

</html>

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

</head>

<body>

<h1>JavaScript 验证输入</h1>

<p>请输入 1 到 10 之间的数字：</p>

<input id="numb">

<button type="button" onclick="myFunction()">提交</button>

<p id="demo"></p>

<script>

function myFunction() {

    var x, text;

    // 获取 id="numb" 的值

    x = document.getElementById("numb").value;

    // 如果输入的值 x 不是数字或者小于 1 或者大于 10，则提示错误 Not a Number or less than one or greater than 10

    if (isNaN(x) || x < 1 || x > 10) {

        text = "输入错误";

    } else {

        text = "输入正确";

    }

    document.getElementById("demo").innerHTML = text;

}

</script>

</body>

</html>

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

</head>

<body>

<form action="demo_form.php" method="post">

  <input type="text" name="fname" required="required">

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

</form>

<p>点击提交按钮，如果输入框是空的，浏览器会提示错误信息。</p>

</body>

</html>

吴裕雄--天生自然 JAVASCRIPT开发学习： 表单的更多相关文章

  1. 吴裕雄--天生自然 JAVASCRIPT开发学习：对象 实例（2）

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. 吴裕雄--天生自然 JAVASCRIPT开发学习： 正则表达式

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. 吴裕雄--天生自然 JAVASCRIPT开发学习： 表单验证

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. 吴裕雄--天生自然 JAVASCRIPT开发学习：条件语句

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  5. 吴裕雄--天生自然 JAVASCRIPT开发学习：对象

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  6. 吴裕雄--天生自然 JAVASCRIPT开发学习

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  7. 吴裕雄--天生自然 JAVASCRIPT开发学习：函数定义

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  8. 吴裕雄--天生自然 JAVASCRIPT开发学习： this 关键字

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. 吴裕雄--天生自然 JAVASCRIPT开发学习：Date（日期） 对象

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. python pandas数据分析基础入门2——（数据格式转换、排序、统计、数据透视表）

    //2019.07.18pyhton中pandas数据分析学习——第二部分2.1 数据格式转换1.查看与转换表格某一列的数据格式:(1)查看数据类型:某一列的数据格式:df["列属性名称&q ...

  2. Spark技术学院-进去能学到啥？

    Spark技术学院是什么? 主要是浪尖,前腾讯现阿里的大神一起搞的知识分享基地,旨在帮助大家由入门到精通spark,hbase,kafka大数据重要的框架,还有给入门小白指点入门方法,分享入门资料,对 ...

  3. <深入理解redis>读书笔记

    chapter2 键管理与数据结构 对大多数redis解决方案而言,键的命名设计至关重要.对于管理来说,内存消耗和redis性能都与数据结构设计相关.所以对开发者而言,最好有数据结构的命名文档规范. ...

  4. PATH环境 变量

    PATH环境 变量 $HOME/.bash_profile和/etc/profile 两个文件在登陆用户的时候会执行, /etc/profile 所有用户都执行,$HOME/.bash_profile ...

  5. android导入项目build错误

    android studio apply script build.gradle 卡死 buildscript { repositories { maven{ url 'http://maven.al ...

  6. Java笔记: 继承成员覆盖和隐藏

    在扩展类时,既可以向类中添加新的成员,也可以重新定义现有的成员.重定义现有成员的具体效果取决于成员的类型.本文不会详细的介绍概念,只简要总结覆盖(overriding,也叫重写)和隐藏(hiding) ...

  7. 二十六、SAP中通过FORMAT COLOR来设置文字背景颜色

    一.代码如下 二.效果如下

  8. Spring Cloud 支付宝支付的流程

    沙箱环境又称沙盘,为了开发与调试所提供的环境,它与生产环境互相隔离,但具有生产环境几乎完全相同的功能蚂蚁金服开放平台——开发者中心1.https://openhome.alipay.com2.提供的调 ...

  9. HDU 4921 Map DFS+状态压缩+乘法计数

    算最多十条链,能截取某前缀段,每种方案都可以算出一个权值,每种方案的概率都是总数分之一,问最后能构成的所有可能方案数. 对计数原理不太敏感,知道是DFS先把链求出来,但是想怎么统计方案的时候想了好久, ...

  10. 使用kali中的Metasploit通过windows7的永恒之蓝漏洞攻击并控制win7系统（9.27 第十三天）

    1.开启postgresql数据库 2.msfconsole 进入MSF中 3.search 17-010 搜索cve17-010相关的exp auxiliary/scanner/smb/smb_ms ...