Dom之表单提交与默认行为
一、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之表单提交与默认行为的更多相关文章
- vue---阻止默认表单提交的三种方法
vue在做表单提交的时候,需要用到一些自定义的验证规则,这个时候就需要阻止表单默认的提交方式. 方法一:直接阻止 <form id="form" @submit=" ...
- 防止表单提交时刷新页面-阻止form表单的默认提交行为
最近在写 ajax 提交的时候遇到一个问题,在执行 ajax 提交之后,浏览器页面自动刷新了,主要是没有 由于form 表单的默认提交行为.一下是几种阻止 form 表单默认提交行为的方式. 1.使用 ...
- 如何阻止<a>标签默认行为和表单提交
阻止<a>标签默认行为 方式一 (通过return false) <!DOCTYPE html> <html> <head> <meta char ...
- 处理laravel表单提交默认将空值转为null的问题
比如表单提交,如果我们提交了这个字段,但是这个字段为空字符串.在Laravel中会自动转义成Null. 处理这个问题,直到找到中间件\vendor\laravel\framework\src\Illu ...
- form表单提交过程
本文为转载文章! 今天,我将站在HTML和单纯的Asp.net框架的角度来解释它们的工作方式,因此,本文不演示WebForms服务器控件的相关内容. 简单的表单,简单的处理方式 好了,让我们进入今天的 ...
- Ajax表单提交插件jquery form
jQuery Form插件是一个优秀的Ajax表单插件,我们可以非常容易的使用它处理表单控件的值,清空和复位表单控件,附件上传,以及完成Ajax表单提交. jQuery Form有两个核心方法ajax ...
- input file 在开发中遇到的问题 类似ajax form表单提交 input file中的文件
最近在做项目的过程中遇到个问题,在这里做个记录防止日后忘记 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为 ...
- ajax form表单提交 input file中的文件
ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...
- 项目总结15：JavaScript模拟表单提交(实现window.location.href-POST提交数据效果)
JavaScript模拟表单提交(实现window.location.href-POST提交数据效果) 前沿 1-在具体项目开发中,用window.location.href方法下载文件,因windo ...
随机推荐
- IPhone手机自动添加到itunes设置
一,项目设置 如图:点击项目--info 在key下面条目上右键点击,选择添加Application supports iTunes file sharing value设置为yes
- C#处理Json文件
JSON(全称为JavaScript Object Notation) 是一种轻量级的数据交换格式.它是基于JavaScript语法标准的一个子集. JSON采用完全独立于语言的文本格式,可以很容易在 ...
- asp.net mvc3.0第一个程序helloworld开发图解
步骤一:新建asp.net mvc3.0项目 (选择Razor模板) 步骤二:创建控制器 步骤三:控制器源码内右键创建对应视图 步骤四:控制器内添加代码 步骤五:视图页面输出内容 步骤六:F5调试
- gitlab The repository for this project is empty
/***************************************************************************** * gitlab The reposito ...
- 整合Open vSwitch与DNSmasq为虚拟机提供DHCP功能
继上文<Ubuntu14.04安装配置Open vSwitch>安装好Open vSwitch后,这里我们将要创建两个KVM虚拟机,并通过DNSmasq来为这两个虚拟机自动分配私网IP地址 ...
- USB协议-USB的包结构及包的分类
USB是串行总线,所以数据是一位一位地在数据线上传送的.既然是一位一位地传送,就存在着一个数据位先后的问题.USB使用的是LSB在前的方式,即先出来的是最低位数据,接下来是次低位,最后是最高位(MSB ...
- mysql保存中文乱码的原因和解决办法
当你遇到这个mysql保存中文乱码问题的时候,期待找到mysql保存中文乱码的原因和解决办法这样一篇能解决问题的文章是多么激动人心. 也许30%的程序员会选择自己百度,结果发现网友已经贴了很多类 ...
- Java-->利用文件指针分割文件
--> 大体上和字节流分割的方式没什么区别,只是加入文件指针确定要开始分割的位置... package com.dragon.java.splitmp3; import java.io.File ...
- 触摸精灵lua脚本实现微信群加好友功能
--此脚本针对iPhone5/5s --目前只实现一个屏幕微信群好友的添加,如果想添加更多好友, --需要划屏操作,执行划屏操作时建议循环滑动 function main() --获取屏幕的分辨率 w ...
- C#裁剪照片并保存
/// <summary> /// /// </summary> /// <summary> /// 生成缩略图 /// </ ...