一个小的功能,也体现了了这几天写程序过程中的遇到的一些常发事件,准备有时间研究一下jQuery和原生js,问题的出现:使用jQuery获取到的节点到底是属于什么,有些事件

居然不能用,就如我今天用到的事件 onchange 和oninput ,还有对于onclick 和click,

先总结一下这个小小的功能:输入框要输入money,那就只有两位小数,我们要确保输多位小数时,不让他提交,提交按钮变灰色,当小数点后是两位则回复按钮状态,

onchange事件,监听input 输入的值是否符合要求,不符合则改变按钮状态:代码如下:

bid.onchange=function(){
var num = bid.value;
var dot = num.split('.');
if(dot[1]!=null){ if(dot[1].length>2){
var addbtn = document.getElementById("addbtn");
addbtn.setAttribute("disabled",true);
alert("请保留两位小数");
}
}
}

oninput事件,随时监听input输入的值,小数点后的位数,当时两位时,按钮回复状态:代码如下:

bid.oninput=function(){
var num = bid.value;
var dot = num.split('.');
if(dot[1]!=null){ if(dot[1].length<=2){
var addbtn = document.getElementById("addbtn");
addbtn.removeAttribute("disabled");
}
}
};

说一下两个事件的区别:onchange 当文本框失去焦点时,检查input里的值是否符合要求,执行函数

           oninput 实时监听文本框的值,不符合要求事件触发,(但是虽不符合要求,值却已经在文本框了)这就为什么两个事件得同时用

待续。。。jQuery和原生js 对事件的操作支持:

  这篇文章的前部分很早就写完了,最近才明白了,不是jquery和js的问题,是DOM的问题,以前没意识到这个问题,最近搞清楚了(和别人讨论问题时,提到了)恍然大悟,犹如醍醐灌顶值功效。哈哈,感觉使用jquery瞬间轻松了好多,这种感觉是只有个我这种菜鸟才能感受的。

  首先,jquery和DOM 他们各自的属性方法是不能混用的,简单说,jquery是方法,DOM是属性,

    我们使用dom获取属性节点,使用jquery方法操作节点,和平共处。

  然后,就涉及相互转换的问题,看了一些资料,表达一下自己最切实的理解。

    使用$("**")获取节点,就是jquery对象,使用jquery的方法属性,

    使用$("**")[index]这样,就变成了DOM对象,使用DOM方法和属性。

    使用$($("**")[index]),转换成jquery对象,使用jquery的方法。

  三句切实理解jquery和DOM的操作方式,希望以后在前端的道路上,勇往直前!

有什么问题,欢迎吐糟,共同进步!

<h2>现阶段目标:能用代码量解决的问题,就不是问题!</h2>

input的onchange 和oninput事件的更多相关文章

  1. JavaScript 使用HTML DOM的oninput事件,实时监听value值变化

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

  2. oninput、onchange与onpropertychange事件的区别, 与input输入框实时检测

    这几天项目着急,同时也学到好多以前没有接触过的知识.oninput.onchange与onpropertychange事件的区别, 与input输入框实时检测 onchange事件只在键盘或者鼠标操作 ...

  3. 总结oninput、onchange与onpropertychange事件的用法和区别,onchange

    前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过去一般都使用onchange/onkeyup/onkeypress/onke ...

  4. 总结oninput、onchange与onpropertychange事件的用法和区别 书写搜索的神奇代码

    总结oninput.onchange与onpropertychange事件的用法和区别 最近手机开发一个模糊搜索的功能组建,在网上就找到这篇文章! 前端页面开发的很多情况下都需要实时监听文本框输入,比 ...

  5. onchange、oninput、onpropertyChange事件的异同

    onchange事件适用于input\textarea\select元素上,支持各大浏览器,该事件只有在键盘或者鼠标操作改变对象属性,且失去焦点时触发,脚本触发无效: oninput事件适用于inpu ...

  6. 实时监听文本框输入 oninput、onchange与onpropertychange事件的用法和区别

    前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过去一般都使用onchange/onkeyup/onkeypress/onke ...

  7. 总结oninput、onchange与onpropertychange事件的用法和区别

    前端页面开发的很多情况下都需要实时监听文本框输入,比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数.过去一般都使用onchange/onkeyup/onkeypress/onke ...

  8. oninput事件和onchange事件区别

    onchange事件 触发条件:在域内容更改时触发,也可用于单选框和复选框改变后触发 作用对象:select.input.textarea oninput事件 触发条件:在域内容更改时触发(严格说在用 ...

  9. 总结oninput、onchange与onpropertychange事件的使用方法和差别

    onchange事件仅仅在键盘或者鼠标操作改变对象属性,且失去焦点时触发,脚本触发无效:而onkeydown/onkeypress/onkeyup在处理复制.粘贴.拖拽.长按键(按住键盘不放)等细节上 ...

随机推荐

  1. c语言进阶5-递归算法

    一.  什么是递归 程序调用自身的编程技巧称为递归( recursion). 递归做为一种算法在程序设计语言中广泛应用. 一个过程或函数在其定义或说明中有直接或间接调用自身的一种方法,它通常把一个大型 ...

  2. [leetcode] 264. Ugly Number II (medium)

    263. Ugly Number的子母题 题目要求输出从1开始数,第n个ugly number是什么并且输出. 一开始想着1遍历到n直接判断,超时了. class Solution { public: ...

  3. [PTA] 数据结构与算法题目集 6-3 求链式表的表长

    Length( List L ){ int res=0; while(L!=NULL){ res++; L=L->Next; } return res; }

  4. Tomcat(Linux)

    百度云:链接:http://pan.baidu.com/s/1o7MNTJc    密码:cfof 官方下载网址:http://archive.apache.org/dist/tomcat/tomca ...

  5. C语言中的“>>”和“

    先说左移,左移就是把一个数的所有位都向左移动若干位,在C中用<<运算符.例如: int i = 1; i = i << 2; //把i里的值左移2位 也就是说,1的2进制是00 ...

  6. Spring MVC中的 权限拦截定义 以及 权限拦截的研发步骤

    权限拦截 (拦截器: 对请求进行区分) 1 实现的价值(作用) 用户未登录:访问没用登录的URL,拦截到以后 跳转回登录 用户未登录:访问登录的URL,直接放行到后续流程处理框架,进行后续的操作 用户 ...

  7. java名词

    1 applet Java语言编写的小程序,可以包含在html页面中,有支持Java语言的浏览器执行,作用是在页面产生动态效果. 2 jdk java development kit java 开发环 ...

  8. MySQL5.7运行CPU达百分之400处理方案

    用户在使用 MySQL 实例时,会遇到 CPU 使用率过高甚至达到 100% 的情况.本文将介绍造成该状况的常见原因以及解决方法,并通过 CPU 使用率为 100% 的典型场景,来分析引起该状况的原因 ...

  9. jdk8与jdk7中hashMap的resize分析

    在分析代码之前,我们先抛出下面的问题: hashmap 扩容时每个 entry 需要再计算一次 hash 吗? 我们首先看看jdk7中的hashmap的resize实现 1 void resize(i ...

  10. GC是什么?为什么我们要去使用它

    GC(Garbage Collection)是各大语言的宠儿,也是计算机科学领域里很热门的一个话题.最早在JVM中有看过这个算法,后来发现即使是js这种脚本语言也是有GC的.单纯就JVM来说的话,GC ...