<!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中for in的用法

    for(var i=0;i<len;i++)这样的用法一般都可以用for in 来替代. 例如: var a = ["a","b","c&quo ...

  2. 更换app开发者账号

    在开源中国上面有一个答案,http://www.oschina.net/question/2307266_237220 下面是我的执行步骤 首先在iTunes Connect中找到要更换开发者账号的a ...

  3. jquery.cookie.js && java后台代码 操作cookie实现记住当前用户输入信息代码

    下载jquery.cookie.js地址看这里:http://pan.baidu.com/s/1gdCPaN5 //初始化页面时验证是否记住了密码 $(document).ready(function ...

  4. JavaScript、全选反选-课堂笔记

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

  5. Jquery父页面和子页面的相互操作

    //父页面调用子页面Add函数 $("iframe")[0].contentWindow.Add() //父页面对子页面Id为Sava的Dom元素执行一次单击操作 $(" ...

  6. [工具分享]JetBrains ReSharper 9.0 正式版和注册码

    话不多说.直接上百度云盘分享链接.有需要的盆友去下载吧. 百度云盘:http://pan.baidu.com/s/1kTKIQhh 注册码这里提供一个.有需要的自己拿走.或者可以使用压缩包里面的key ...

  7. MVC原理

       C代表Controller,负责用户界面和业务逻辑层的通信控制,一方面解释来自用户界面的输入,识别用户动作(如点击按钮等),调用相应Model中的方法, 另一方面处理来自Model的事件和返回的 ...

  8. Symmetric Multiprocessor Organization

    COMPUTER ORGANIZATION AND ARCHITECTURE DESIGNING FOR PERFORMANCE NINTH EDITION

  9. easyui datagrid 编辑模式详解

       一,建立编辑器 从api得知,扩展一种新的编辑器类型,需要提供以上几个方法.项目中正好需要一个checkbox 类型编辑器,但在easyui中并没提供这样的编辑器,那我们可以通过扩展编辑器来解决 ...

  10. erlang调试之JCL

    Job control mode (JCL), in which jobs can be started, stopped, detached or connected. Only the curre ...