234

请输入你的评论:

5

ASP.NET jQuery 食谱4 (复制TextBox的文本到本

系统 1672 0

在这节,我们将看到如何把多行文本框的内容复制到剪贴板上。
注意:jQuery clipboard plugin 只支持IE

界面代码:

View Code
        
           1
        
        
          <
        
        
          form 
        
        
          id
        
        
          ="form1"
        
        
           runat
        
        
          ="server"
        
        
          >
        
        
2 < div align ="center" >
3 < fieldset style ="width: 400px; height: 300px;" >
4 < p > 请输入你的评论: </ p >
5 < asp:TextBox ID ="txtComment" TextMode ="MultiLine" Rows ="5" Width ="300px" Height ="200px"
6 runat ="server" ></ asp:TextBox >
7 < br />
8 < asp:HyperLink ID ="lnkHighlight" Text ="点击复制评论" runat ="server" ></ asp:HyperLink >
9 </ fieldset >
10 </ div >
11 </ form >

显示界面:

ASP.NET jQuery 食谱4 (复制TextBox的文本到本地剪贴板上)_第1张图片

脚本部分:

      
         1
      
      
        <
      
      
        script 
      
      
        src
      
      
        ="Scripts/jquery-1.4.1-vsdoc.js"
      
      
         type
      
      
        ="text/javascript"
      
      
        ></
      
      
        script
      
      
        >
      
      
2 < script src ="Scripts/jquery.clipboard.js" type ="text/javascript" ></ script >
3 < style type ="text/css" >
4 a
5 {
6 color : #0000FF ;
7 cursor : pointer ;
8 }
9 </ style >
10 < script type ="text/javascript" >
11 $(document).ready( function () {
12 $.clipboardReady( function () {
13 $( " a " ).click( function () {
14 $( " #<%=txtComment.ClientID %> " ).select();
15 $.clipboard($( " #<%=txtComment.ClientID %> " ).val());
16 });
17 });
18 });
19 </script>

加入脚本后点击复制按钮显示效果如下:

ASP.NET jQuery 食谱4 (复制TextBox的文本到本地剪贴板上)_第2张图片

打开记事本按Ctrl+V:

ASP.NET jQuery 食谱4 (复制TextBox的文本到本地剪贴板上)_第3张图片

哈哈成功了,就这么简单。
 
插件下载地址: http://plugins.jquery.com/project/clipboard
 
另外有一个Zero clipboard 插件支持跨浏览器,它是通过一个flash文件和JavaScirpt接口实现的,想了解更多信息,请访问http://code.google.com/p/zeroclipboard/



ASP.NET jQuery 食谱4 (复制TextBox的文本到本地剪贴板上)


更多文章、技术交流、商务合作、联系博主

微信扫码或搜索:z360901061

微信扫一扫加我为好友

QQ号联系: 360901061

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描下面二维码支持博主2元、5元、10元、20元等您想捐的金额吧,狠狠点击下面给点支持吧,站长非常感激您!手机微信长按不能支付解决办法:请将微信支付二维码保存到相册,切换到微信,然后点击微信右上角扫一扫功能,选择支付二维码完成支付。

【本文对您有帮助就好】

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描上面二维码支持博主2元、5元、10元、自定义金额等您想捐的金额吧,站长会非常 感谢您的哦!!!

发表我的评论
最新评论 总共0条评论