首页 > 编程语言 > 详细

javaScript复制粘贴

时间:2017-04-12 03:57:01      阅读:326      评论:0      收藏:0      [点我收藏+]

1.clipboard.js 实现了纯 JavaScript (无 Flash)的浏览器内容复制到系统剪贴板的功能。可以在浏览器和 Node 环境中使用。支持 Chrome 42+、Firefox 41+、IE 9+、Opera 29+

cdn:<script src="https://cdn.bootcss.com/clipboard.js/1.6.1/clipboard.min.js"></script>

用法:

<script src="clipboard.min.js"></script>
 <textarea id="bar" cols="62" rows="5" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">脚本之家是国内专业的网站建设资源、脚本编程学习类网站,提供asp、php、asp.net、javascript、jquery、vbscript、dos批处理、网页制作、网络编程、网站建设等编程资料。</textarea>
 
<!-- Trigger -->
<button class="btn" data-clipboard-action="copy" data-clipboard-target="#bar">
  Cut to clipboard
</button>
<script>
var clipboard = new Clipboard(.btn);
clipboard.on(success, function(e) {
  console.info(Action:, e.action);
  console.info(Text:, e.text);
  console.info(Trigger:, e.trigger);
alert("复制成功");
  e.clearSelection();
});
 
clipboard.on(error, function(e) {
  console.error(Action:, e.action);
  console.error(Trigger:, e.trigger);
});
</script>

 2.react-copy-to-clipboard

安装:npm install --save react-copy-to-clipboard

用法:

import React from ‘react‘;
import CopyToClipboard from ‘react-copy-to-clipboard‘;

const App = React.createClass({
  getInitialState() {
    return {value: ‘‘, copied: false};
  },

  render() {
    return (
      <div>
        <input value={this.state.value}
          onChange={({target: {value}}) => this.setState({value, copied: false})} />&nbsp;

        <CopyToClipboard text={this.state.value}
          onCopy={() => this.setState({copied: true})}>
          <span>Copy to clipboard with span</span>
        </CopyToClipboard>&nbsp;

        <CopyToClipboard text={this.state.value}
          onCopy={() => this.setState({copied: true})}>
          <button>Copy to clipboard with button</button>
        </CopyToClipboard>&nbsp;

        {this.state.copied ? <span style={{color: ‘red‘}}>Copied.</span> : null}
      </div>
    );
  }
});


React.render(<App />, document.body);

javaScript复制粘贴

原文:http://www.cnblogs.com/cosyer/p/6696487.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!