<script src= " react-dom js ">< script> " />
频道栏目
首页 > 程序开发 > web前端 > HTML/CSS > 正文
React DOM click focus textbox代码实例
2017-11-16 09:25:25         来源:qq_34351732的博客  
收藏   我要投稿

React DOM click focus textbox代码实例

<html>
  <head>
    <title>Document</title>
    <script src="../react.js"></script>
    <script src="../react-dom.js"></script>
    <!-- //引用资源,JSX转HTML -->
    <script src="https://cdn.bootcss.com/babel-core/5.8.38/browser.min.js"></script>
  </head>

  <body>
    <p id="reactContainer"></p>

    <script type="text/babel"> //babel JSX => HTML
      const Forcus = React.createClass({
        handleClick: function() {
          this.refs.text.focus()//获取真实的DOM节点
        },
        render: function() {
          return (
            <p>
              <input type="text" ref="text"/>//设置DOM标识
              <input type="button" value="focus the text input" onClick={this.handleClick}/>
            </p>
          )
        }
      })

      ReactDOM.render(
        <Forcus />,
        document.getElementById('reactContainer')
      )
    </script>
  </body>
</html>

 

点击复制链接 与好友分享!回本站首页
上一篇:ajax与form表单submit的不同之处介绍
下一篇:web前端优化之图片的相关优化
相关文章
图文推荐
点击排行

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 举报中心

版权所有: 红黑联盟--致力于做实用的IT技术学习网站