一、button提交表单

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

    <form action="https://www.sogou.com/web" method="get">

        <input type="text" name="query">

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

    </form>

</body>

</html>

　　效果图

二、JS提交表单

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

    <form id="form1" action="https://www.sogou.com/web" method="get">

        <input type="text" name="query">

        <div onclick="Submit();">提交</div>

    </form>

    <script type="text/javascript">

        function Submit(){

            document.getElementById('form1').submit();

            }

    </script>

</body>

</html>

　　效果图

三、问题：如果文本框中没有输入内容或内容全部为空格，我就不让它有提交的动作，怎么办呢？

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

    <form id="form1" action="https://www.sogou.com/web" method="get">

        <input type="text" name="query">

        <input type="submit" value="提交" onclick="return Submit();">

    </form>

    <script type="text/javascript">

        function Submit(){

            var obj = document.getElementsByName('query')[0];

            if(obj.value.trim()){

                return true

            }else{

                alert('请输入内容');

                return false

            }

            }

    </script>

</body>

</html>

解释：　　

Dom之表单提交与默认行为的更多相关文章

  1. vue---阻止默认表单提交的三种方法

    vue在做表单提交的时候,需要用到一些自定义的验证规则,这个时候就需要阻止表单默认的提交方式. 方法一:直接阻止 <form id="form" @submit=" ...

  2. 防止表单提交时刷新页面-阻止form表单的默认提交行为

    最近在写 ajax 提交的时候遇到一个问题,在执行 ajax 提交之后,浏览器页面自动刷新了,主要是没有 由于form 表单的默认提交行为.一下是几种阻止 form 表单默认提交行为的方式. 1.使用 ...

  3. 如何阻止<a>标签默认行为和表单提交

    阻止<a>标签默认行为 方式一 (通过return false) <!DOCTYPE html> <html> <head> <meta char ...

  4. 处理laravel表单提交默认将空值转为null的问题

    比如表单提交,如果我们提交了这个字段,但是这个字段为空字符串.在Laravel中会自动转义成Null. 处理这个问题,直到找到中间件\vendor\laravel\framework\src\Illu ...

  5. form表单提交过程

    本文为转载文章! 今天,我将站在HTML和单纯的Asp.net框架的角度来解释它们的工作方式,因此,本文不演示WebForms服务器控件的相关内容. 简单的表单,简单的处理方式 好了,让我们进入今天的 ...

  6. Ajax表单提交插件jquery form

    jQuery Form插件是一个优秀的Ajax表单插件,我们可以非常容易的使用它处理表单控件的值,清空和复位表单控件,附件上传,以及完成Ajax表单提交. jQuery Form有两个核心方法ajax ...

  7. input file 在开发中遇到的问题 类似ajax form表单提交 input file中的文件

    最近在做项目的过程中遇到个问题,在这里做个记录防止日后忘记 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为 ...

  8. ajax form表单提交 input file中的文件

    ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...

  9. 项目总结15：JavaScript模拟表单提交(实现window.location.href-POST提交数据效果)

    JavaScript模拟表单提交(实现window.location.href-POST提交数据效果) 前沿 1-在具体项目开发中,用window.location.href方法下载文件,因windo ...

随机推荐

  1. win7 64位搭建scrapy

    http://blog.csdn.net/it_yuan/article/details/23856713 win7 64位系统依赖的scrapy文件链接:http://pan.baidu.com/s ...

  2. iOS开发:集成支付宝(遇见的坑和便捷撸代码)

    开发iOS最重要的就是支付了,天朝之内最常用的就是支付宝了,下面就以自己的经历说明如何集成支付宝+遇见的坑. 首先,集成支付宝最好别使用Cocoapods,很多人都说使用起来很方便,可是我每次只要使用 ...

  3. Socket编程回顾，一个最简单服务器程序

    第一次接触服务器是快毕业的时候,是不是有点晚(#￣ω￣),这也导致工作方向一直没考虑网络编程这块,做了好多其他没啥“意思”的技术. 之前看到一篇博文提到程序猿80%都是庸才,10%是人才,10%是天才 ...

  4. Expect:100-continue

    在使用curl做POST的时候, 当要POST的数据大于1024字节的时候, curl并不会直接就发起POST请求, 而是会分为俩步, 发送一个请求, 包含一个Expect:100-continue, ...

  5. Bootstrap组件On和Off语法

    $(document).on('click.bs.carousel.data-api','td',function(e){}) $(document).off('.carousel.data-api' ...

  6. Core Java Volume I — 3.6. Strings

    3.6. StringsConceptually, Java strings are sequences of Unicode characters(Java的字符串是一个Unicode序列). Fo ...

  7. MySQL Cluster在线备份和恢复

    备份方式 一般MySQL数据库都是用mysqldump命令进行数据备份,其生成的文件实际上是创建对象和导入对象的sql语句. 在MySQL Cluster集群上,可以在管理节点上使用start bac ...

  8. ZOJ Problem Set - 3643 Keep Deleting

    题目大意: 给出a和b串,a是b串的子串,如果b串有连续的a串,那么就将b串的a串删除,问删除多少次: 题目分析: 打比赛的时候没敲出来,后来想到用栈的思想去模拟就行,网上还有用KMP+栈去做的,没有 ...

  9. HOG 梯度方向直方图简介（转载）

    一.基本HOG算法 HOG特征最早出现在SIFT算法中,由于其极强的图像特征描述能力,逐渐被人们熟知和广泛运用,其在目标检测方面表现尤为突出. HOG特征提取过程 步骤一:遍历图像每个像素点,以其为中 ...

  10. Win+R运行自定义程序应该这样玩

    互联网是一个“生态圈”,Windows有自己的生态学,有些看似高效的“奇技淫巧”实则只是搞笑. 我很以前十分崇拜善用佳软的站长,对事不对人,有些弊端,只是我们不知道,但并不代表就没有. 有些“恍然大悟 ...