点击复制按钮复制指定文本内容

2014-09-24 11:03:00
admin
原创 2530
摘要:点击复制按钮复制指定文本内容

如何点击复制按钮复制文本框里内容,请看下图:

点击复制按钮复制指定文本内容

代码如下:

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery.zclip.min.js"></script>
<div class="copybox clearfix">
  <div class="copybox-n1 clearfix">
    <div style="width:232px;float:left;height:36px;overflow:hidden;zoom:1">
      <input type="text" id="mytxt1" value="点击右侧复制按钮复制" class="n1input">
    </div>
    <div style="width: 48px; height: 36px; position: absolute; margin-left: 232px;*margin-left:0px;_margin-left: 0">
      <button id="copy_input1" class="n1-btn">复制</button>
    </div>
  </div>
  <div class="copybox-n2 clearfix">
    <div style="width:232px;float:left;height:36px;overflow:hidden;zoom:1">
	  <input type="text" id="mytxt2" value="点击右侧复制按钮复制" class="n1input">
	</div>
    <div style="width: 48px; height: 36px; position: absolute; margin-left: 232px;*margin-left:0px; _margin-left:0">
      <button id="copy_input2" class="n1-btn">复制</button>
    </div>
  </div>
</div>
<script type="text/javascript">
  $(function() {
    /*复制*/
    $('#copy_input1').zclip( {
      path : 'js/ZeroClipboard.swf',
      copy : function() {return $('#mytxt1').val();/*复制内容*/},
      afterCopy : function() {alert("复制成功");/*复制成功*/}
    });
    /*复制*/
    $('#copy_input2').zclip( {
      path : 'js/ZeroClipboard.swf',
      copy : function() {return $('#mytxt2').val();/*复制内容*/},
      afterCopy : function() {alert("复制成功");/*复制成功*/}
    });
  });
</script>