html中行内调用function的时候,是通过window调用的function，所以打印this等于打印window，所以在使用行内注册事件时务必传入参数this

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <style>

        .wrong {

            border: 2px solid red;

        }

        .right {

            border: 2px solid #91B81D;

        }

    </style>

</head>

<body>

    账号：<input type="text" name="name" value="" onblur="fn(this)" /><br /><br />

    密码：<input type="text" name="name" value="" onblur="fn(this)"/>

    <script>

        function fn(ele) {

            if (ele.value.length < 6 || ele.value.length > 12) {

                ele.className = "wrong";

            } else {

                ele.className = "right";

            }

        }

    </script>

</body>

</html>

JS——行内式注册事件的更多相关文章

  1. js行内式遇到的一些问题 DOM对象和jq对象转换的问题

    这两天给后台页面做页面,我的工作比较简单,只需要写结构和样式就行了,写好之后,后端大哥用ajax重写页面加载数据,顺便给标签添加选中事件,做选中后变色的处理,但是却遇到一个问题,一直选不到触发事件这个 ...

  2. JavaScript--返回顶部方法:锚链接、行内式js写法、外链式、内嵌式

    返回网页顶部方法 一.锚链接 simpleDemo: <!DOCTYPE html> <html lang="en"> <head> <m ...

  3. Angular 行内式依赖注入

    var app = angular.module('myApp', ['ng']); //创建一个自定义服务app.factory('$Debug', function () { return { d ...

  4. 0008 CSS初识（行内式、内部样式表、外部样式表）

    typora-copy-images-to: media 第01阶段.前端基础.CSS初识 CSS层叠样式表 学习目标 理解 css的目的作用 css的三种引入方式 应用 css三种引用方式的书写 通 ...

  5. 移动端使用rem.js,解决rem.js 行内元素占位问题

    父级元素: letter-spacing: -0.5em;font-size: 0; 子级元素: letter-spacing: normal; display: inline-block; vert ...

  6. !important覆写css行内样式

    <div class="block"> <span style="font-weight: bold; color: red;">Hel ...

  7. HTML行内元素与块级元素有哪些及区别详解

    转自 https://www.jb51.net/web/724286.html   这篇文章主要介绍了HTML行内元素与块级元素有哪些及区别详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具 ...

  8. js闭包理解案例-解决for循环为元素注册事件的问题

      转发自http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html       一.变量的作用域 要理解闭包,首 ...

  9. JS组件系列——BootstrapTable 行内编辑解决方案：x-editable

    前言:之前介绍bootstrapTable组件的时候有提到它的行内编辑功能,只不过为了展示功能,将此一笔带过了,罪过罪过!最近项目里面还是打算将行内编辑用起来,于是再次研究了下x-editable组件 ...

随机推荐

  1. 工资（money）

    (money/money.in/money.out) 时限1000ms 内存256MB 聪哥在暑假参加了打零工的活动,这个活动分为n个工作日,每个工作日的工资为Vi.有m个结算工钱的时间,聪哥可以自由 ...

  2. HBase连接数据库（集群）

    一.使用java接口对hbase进行表的创建1.引入需要的jar包2.代码: public static void main(String[] args) throws Exception { //得 ...

  3. C. Hexadecimal's Numbers

    C. Hexadecimal's Numbers time limit per test 1 second memory limit per test 64 megabytes input stand ...

  4. Ubuntu 16.04解决在虚拟终端（Ctrl+Alt+F1）下显示菱形中文乱码问题

    在安装Ubuntu时,如果默认选择了中文,那么以后进去到虚拟终端就会出现菱形的中文乱码. 其实这个是无解的,但是可以通过以下技巧去实现: 1.把系统转成英文的 sudo gedit /etc/defa ...

  5. nginx: 添加文件下载目录

    修改nginx.conf,添加如下行: location /file/ {    alias /usr/share/nginx/html/file/;    add_header Content-di ...

  6. 1.4－动态路由协议OSPF⑤

    OSPF的特殊区域(Stub/total Stub区域,无法引入外部路由): ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 第一种 ...

  7. bzoj2186【SDOI2008】沙拉公主的困惑

    2186: [Sdoi2008]沙拉公主的困惑 Time Limit: 10 Sec  Memory Limit: 259 MB Submit: 2363  Solved: 779 [id=2186& ...

  8. Android Message和obtainMessage的差别

    前几天须要实现一个以太网功能就看了以太网的源代码部分,看见了源代码部分在消息处理时,发现有一些不同的地方:   平时我在处理消息时:   1.首先创建Handler对象:   private Hand ...

  9. JavaScript初探之——图片移动

    在我们打开页面的时候我们看到的大部分页面都是动态的,曾经学习VB的时候要实现一些动态的画面第一个想到的就是用Flash,如今学习了BS的东西,才算是开眼界了,刚刚学习了一个动画的效果,给大家展示一下. ...

  10. POJ--3164--Command Network【朱刘算法】最小树形图

    链接:http://poj.org/problem?id=3164 题意:告诉n个点坐标,m条边表示两个点之间有路.从1点開始建立一个有向图最小生成树. 朱刘算法模板题 =============== ...