2018-06-25 js表单事件、三个高度和Ajax异步通讯技术

表单事件:

  onfocus -> 表单控件得到焦点时触发;

    obj_ipt.onfocus=function(){}; 

  onblur -> 表单控件失去焦点时;

  onchange -> 表单控件内容被改变时;

  onselect -> 控件被选择时;

  onsubmit -> 当表单提交时;

  onreset -> 当表单重置时;

 表单对象方法:

  select() -> 对象被选中;

    ipt_obj.select();

  blur() -> 失去焦点

  focus() -> 得到焦点

  click() -> 被点击

  submit() -> 表单被提交

  Reset() -> 表单被重置

三个高度:

  h1=document.documentElement.clientHeight ->浏览器的(有效)可视高度

  h2=document.documentElement.scrollHeight ->浏览器的总高度;

  h3=document.documentElement.scrollTop -> 已滚动的高度

  h3 + h1 = h2

Ajax无刷新技术

  xhr = new XMLHttpRequest();-> 生成ajax对象

  xhr.open(‘post‘,‘index.php?name=‘+name,true) ->js post请求index.php文件,并将name传给后台,ture为异步通讯,false则为同步

  xhr.send -> 发出异步通讯请求

  //监听整个通讯过程

  xhr.onreadystatechange=function(){

  //xhr.readyState的值为4 则请求结束,可以获取返回值判断后台执行的成功与否

    if(xhr.readyState == 4){

      if(r==‘1‘){

        //成功

      }else{

        //失败

      }

    }

  }

原文地址:https://www.cnblogs.com/miaoxingren/p/9226194.html

时间: 2024-10-06 18:49:58

2018-06-25 js表单事件、三个高度和Ajax异步通讯技术的相关文章

form表单submit提交内容,跟ajax异步提交form表单的区别,

因为开发一个小细节,本来是上传文件,填写文件名进行ajax提交,但是没有获取到文件的绝对地址, 所以使用了form表单提交文件,然后又觉得form表单+ajax提交联系起来比较好,不用改动太多代码. 区别: Form表单提交:一般都会进行页面跳转: Ajax异步提交:可以不进行页面跳转: Form表单提交 <body> <div id="forms”> <form id="form1" action="/users/login"

js日期/时间比较函数,以及js校验表单后提交表单的三种方法,表单验证,以及三种结合

<pre class="html" name="code"> js日期比较(yyyy-mm-dd) function duibi(a, b) { var arr = a.split("-"); var starttime = new Date(arr[0], arr[1], arr[2]); var starttimes = starttime.getTime(); var arrs = b.split("-");

jQuery基础(鼠标事件,表单事件,键盘事件,自定义事件 篇)

1.jQuery鼠标事件之click与dbclick事件 方法一:$ele.click()(不带参数) <div id="test">点击触发<div> $("ele").click(function(){ alert('触发指定事件') }) $("#test").click(function(){ $("ele").click() //手动指定触发事件 });   方法二:$ele.click( h

JS表单验证示例

1 </<!DOCTYPE html> 2 <html> 3 <head> 4 <title>JS表单验证</title> 5 <meta http-equiv = "content-type" content="text/html; charset = utf-8 "> 6 <link rel="stylesheet" href="JSlogin.cs

JS 表单的验证

表单用于搜集不同类型的用户输入. 表单的基本元素有: Button Checkbox Text Radio Select Option Submint Reset Textarea 具体怎么使用我就不介绍了,可以查看HTML. 表单的基本属性有 action  表单要发送出去的地址 enctype:表示表单的封装方式 target:表示发送后的跳转方式 method:提交的方式,一般有get跟post 如果采用 POST 方法,浏览器将会按照下面两步来发送数据.首先,浏览器将与 action 属

【转】vue.js表单校验详解

1.npm安装vue-validator $ npm install vue-validator 代码示例: var Vue=require("vue"); var VueValidator=require("vue-validator"); Vue.use(VueValidator); 2.直接使用script标签引入vue.js 要下载vue-validator,那么进入cdn的地址https://cdn.bootcss.com/vue-validator/2.

JS表单验证类HTML代码实例

以前用的比较多的一个JS表单验证类,对于个人来说已经够用了,有兴趣的可以在此基础上扩展成ajax版本.本表单验证类囊括了密码验证.英文4~10个 字符验证. 中文非空验证.大于10小于100的数字.浮点数验证.日期验证.邮件检查.网址验证.固定电话和手机号码验证.IP地址验证.邮编和QQ号码验证. MSN和身份证验证等. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.

jquery.validation.js 表单验证

jquery.validation.js 表单验证 官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuery plugin: Validation 使用说明 一导入js库 <script src="../js/jquery.js" type="text/javascript"></script> <script src="../js/jq

node.js表单——formidable/////z

node.js表单——formidable node处理表单请求,需要用到formidable包.安装formidable包的命令如下: npm install formidable 安装package的路径分为两种,一种是本地目录,一种是全局目录. npm install xxx -g 命令将模块下载安装到全局目录中. 全局目录可以通过 npm config set prefix "目录路径" 来设置. 通过 npm config get prefix 来获取当前设置的目录. npm