<!DOCTYPE>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

        <script src="./js/react.js"></script>

        <script src="./js/react-dom.js"></script>

        <script src="./js/browser.min.js"></script>

        <style>

            *{ margin:0px;  padding:0px;}

        </style>

    </head>

    <body>

        <div id="dome"></div>

        <div id="test"></div>

        <script type="text/babel">

            var Fix = React.createClass({

                getInitialState:function(){

                    return{

                        user:''

                    }

                },

                handleChange:function(e){

                    this.setState({

                        user:e.target.value.toUpperCase()

                    })

                },

                render:function(){

                    return(

                        <div>

    验证码：<input type="text" name="user" value={this.state.user} onChange={this.handleChange} />1f5Q

                        </div>

                    );

                }

            });

            ReactDOM.render(

                <Fix />,

                document.getElementById('dome')

            );

        </script>

    </body>

</html>

夺命雷公狗-----React---20--实现验证码大写的更多相关文章

  1. 夺命雷公狗—angularjs—20—$watch监听的用法

  2. 夺命雷公狗-----React---10--组建嵌套进行数据遍历

    先写一个组建... 然后进行嵌套.. <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  3. 夺命雷公狗-----React---9--map数据的遍历

    比如我们要实现的是这种效果: 用这种方法来写,她只能写死在哪,没啥意思,所以我们定义一个数据,然后来测试下map方法对她遍历出来的数据 <!DOCTYPE html> <html l ...

  4. 夺命雷公狗-----React---8--react官方提供的组建实现双向绑定

    首先要引入她.. <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  5. 夺命雷公狗-----React---7--组建的状态props和state

    props:组建初始要渲染的数据,他是不可以改变的 state:组建状态发生改变,调用render重新渲染数据 我们来写一个例子: <!DOCTYPE html> <html lan ...

  6. 夺命雷公狗-----React---6--props多属性的传递

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 夺命雷公狗-----React---5--props对象的传递

    提示:props的值是不可以改变的... <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  8. 夺命雷公狗-----React---4--props变量的传递

    提示:props的值是不可以改变的... <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  9. 夺命雷公狗-----React---3--标签的规则

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. 夺命雷公狗-----React---2--组建

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 说说 js String

    首先说说js的字符串,说到字符串这个就和我们原来的C# 代码有区别的就是,js里面没有chart类型.就是说他里面的 “ ”和‘ ’是要表达一样的意思. 其实这个里面就有一个问题了特别实在拼接字符串的 ...

  2. std::string的split函数

    刚刚要找个按空格分离std::string的函数, 结果发现了stackoverflow上的这个问题. 也没仔细看, 直接拿来一试, 靠, 不对啊, 怎么分离后多出个空字符串, 也就是 "a ...

  3. python语句

    print语句 print函数中使用逗号输出多个表达式,打印的结果之间使用空格隔开. >>> ') name: zyj age: 24 >>> print(1,2, ...

  4. Django框架初入

    一.Django 特性 数据库功能强大(利用python的类继承,几行代码就可以实现一个动态的数据库操作接口(API)) 强大的后台功能 优雅的网址(正则匹配网址,传递到对应函数) 模板与缓存系统 二 ...

  5. LinkedList实现队列和堆栈的代码

    package 集合; import java.util.LinkedList; /* *队列:先进先出 *把romovelast改成romoveFirst就成了堆栈 先进后出 *  * */publ ...

  6. Failed to execute goal org.apache.maven.plugins:maven-antrun-plugin:1.7:run (dist) on project hadoop-kms: An Ant BuildException has occured

    编译cdh版hadoop2.5.0出现的问题 系统: CentOs66 64位 JDK:1.7 Maven: 3.0.5 Protobuf: libprotoc 2.5.0 编译命令: mvn pac ...

  7. javascript:算法之数组sort排序

    数组sort排序 sort比较次数,sort用法,sort常用 描述 方法sort()将在原数组上对数组元素进行排序,即排序时不创建新的数组副本.如果调用方法sort()时没有使用参数,将按字母顺序( ...

  8. PHP处理一个5G文件，使用内存512M的，数据为整形，从大到小排序，优化排序算法

    $file='./new.txt'; $fp = fopen($file, "r"); $chunk = 4096;//一次处理1M的字节 1M=1024*1024 $fs = f ...

  9. Ajax调用Conrtoller返回数据

    前端ajax function doRefund(){ $.ajax({ type: "POST", catch: false, url: "@Url.Action(&q ...

  10. PHP 水印设置

    一.图片水印 <?php /* 覆盖水印 */ $image = ImageCreateFromJPEG('memcached.jpg'); $stamp = ImageCreateFromPN ...