关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的点击全选状态onclick="select();"。做购物车页面时会要用到。
  • input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange:
1、onchange事件与onpropertychange事件的区别:
onchange事件在内容改变(两次内容有可能还是相等的)且失去焦点时触发;onpropertychange事件却是实时触发,即每增加或删除一个字符就会触发,通过js改变也会触发该事件,但是该事件IE专有。
2、oninput事件与onpropertychange事件的区别:
oninput事件是IE之外的大多数浏览器支持的事件,在value改变时触发,实时的,即每增加或删除一个字符就会触发,然而通过js改变value时,却不会触发;onpropertychange事件是任何属性改变都会触发的,而oninput却只在value改变时触发,oninput要通过addEventListener()来注册,onpropertychange注册方式跟一般事件一样。(此处都是指在js中动态绑定事件,以实现内容与行为分离)
3、oninput与onpropertychange失效的情况:
(1)oninput事件:a). 当脚本中改变value时,不会触发;b). 从浏览器的自动下拉提示中选取时,不会触发。
(2)onpropertychange事件:当input设置为disable=true后,onpropertychange不会触发。 代表用法:
var oInput_text = document.getElementsByTagName('input');
oInput_text.oninput = function(){
  alert('你要动我??');
};

 
  • 文本框的点击全选状态onclick="select();"

用法1:直接html标签里添加:<input type="text" onclick="select();" value="点击全选">

用法2:js添加点击属性:

var oInput_text = document.getElementsByTagName('input');
oInput_text.onclick = function(){
oInput_text.select();
};
 

html5与js关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的value点击全选状态onclick="select();"。做购物车页面时会要用到。的更多相关文章

  1. jQuery监听文本框值改变触发事件(propertychange)

    完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  2. <input type="text">和<textarea>的区别

    在我们开发时经常需要用到输入框,通常解决办法就是<input type="text">和<textarea>,那么这两个标签有什么区别呢?  一:<i ...

  3. input[type=text]点击之后无边框, 一进页面就显示光标

    1.input[type=text]点击之后无边框 :outline:none; 2. 一进页面就显示光标: <script Language="javascript"> ...

  4. HTML:<input type="text">文本框不可编辑的方式

    1.<input type="text" name="name" value="姓名" disabled /> 该方式显示的文本 ...

  5. js让text值不可改变,同<input type="text" readonly="readonly" />

    <input type="text" size="60"  name="j01" value="www.52jscn.com ...

  6. <input type="text"/>未输入时属性value的默认值--js学习之路

    在百度ife刷题是自己的一个错误引发了我对<input type="text"/>的学习. 先贴代码: <!DOCTYPE html> <html&g ...

  7. html中去掉文本框(input type="text")的边框或只显示下边框

    去掉: <input   type="text"   name="textfield"   style="border:0px;"&g ...

  8. input type =text,按回车键自动提交

    1.当form表单中只有一个<input type="text" name='name' />时按回车键将会自动将表单提交 <form id='form1' ac ...

  9. 对比<input type="text" id="">和<asp:TextBox runat="server" ID="">

    首先这两个都是对应文本输入框形式: <input type="text"class="form-control"id="txt_add_pro_ ...

随机推荐

  1. [转]NHibernate之旅(6):探索NHibernate中的事务

    本节内容 事务概述 1.新建对象 [测试成功提交] [测试失败回滚] 2.删除对象 3.更新对象 4.保存更新对象 结语 上一篇我们介绍了NHibernate中的Insert, Update, Del ...

  2. python 零散记录(七)(上) 面向对象 类 类的私有化

    python面向对象的三大特性: 多态,封装,继承 多态: 在不知道对象到底是什么类型.又想对其做一些操作时,就会用到多态 如 'abc'.count('a') #对字符串使用count函数返回a的数 ...

  3. JavaScript---网络编程(12)--DHTML技术演示(5)-form表单验证技术(正则)

    这里不进行很复杂的后台验证以及JavaScript的正则表达式,只是简单的介绍下这个技术,简单的后台接收与跳转,大概了解怎么验证的就可以.具体的技术,我后面还会继续写博客的.本人也还在学习中. 表单验 ...

  4. 零基础学习视频解码之FFMpeg中比较重要的函数以及数据结构

    http://www.cnblogs.com/tanlon/p/3879081.html 在正式开始解码练习前先了解下关于FFmpeg中比较重要的函数以及数据结构. 1. 数据结构:  (1) AVF ...

  5. pci转并口卡的安装使用

    pci转并口卡模拟出来的并口并不能完全等同于主板上真正的并口.真正的并口打印的时候可以“直接瓶口输出”打印,而不需要安装打印驱动程序. 这个模拟出来的并口却不能使用“直接瓶口输出”(打印机不打印,程序 ...

  6. POJ 3922 A simple stone game

    题目: E - A simple stone game Time Limit:1000MS     Memory Limit:65536KB     64bit IO Format:%I64d &am ...

  7. Power of Cryptography

    //只用一行核心代码就可以过的天坑题目............= = 题目: Description Current work in cryptography involves (among othe ...

  8. Application使用示例

    MainActivity如下: package cn.testapplication; import android.os.Bundle; import android.view.View; impo ...

  9. Intellij 中的git操作 转!

    http://blog.csdn.net/lovesummerforever/article/details/50032937 Git原理以后会分章节介绍,本次主要说一下intellij怎样操作git ...

  10. Android开发——新特性与知识点回顾

    Fragment 用途:在一个Activity里切换界面,切换界面时只切换Fragment里面的内容 生命周期方法跟Activity一致,可以理解把其为就是一个Activity 定义布局文件作为Fra ...