杏子_1024
杏子_1024

React 中实现复制到剪切板功能

React 中实现复制到剪切板功能

  • 前言
  • 最终实现方法
  • 中间踩坑

前言

最近有一个需求是在文章列表中实现一个【复制链接】的功能。如图：

在这里插入图片描述
点击【复制链接】之后，链接将复制到剪切板。可在浏览器中进行粘贴打开。

最终实现方法

最终的实现方法很简单，引一个插件，一行代码搞定。这里演示一个简单的 Demo。

  1. 下载 copy-to-clipboard
    npm i copy-to-clipboard --save
  2. 引入 copy 方法，在点击按钮时调用 copy 方法
import copy from 'copy-to-clipboard';
function coppyUrl(url){
     
  copy(url);
  alert('复制成功');
};
function App(){
     
  return <button onClick={
     ()=>coppyUrl('https://www.baidu.com/')}><button>	
};
export default App;

中间踩坑

刚开始在网上找了各种 js 实现复制链接的办法。要么出现浏览器兼容性，要么主要是针对原生 DOM 操作。在此记录一下。

1. 只兼容 IE 浏览器

效果：
React 中实现复制到剪切板功能_第1张图片
原理：

  1. 使用 window.clipboardData.setData 方法。不过该方法只兼容 IE 浏览器。
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <textarea id="input" style="width: 300px; height: 100px">
    Lorem ipsum dolor, sit amet consectetur adipisicing elit. Maxime expedita corporis culpa voluptates deleniti eveniet voluptatem laborum facere quos fugit, obcaecati corrupti repellat voluptatibus iste quae! Illum sint quibusdam velit?</textarea
          >    
    <button type="button"  onClick="copyUrl()">
      点此复制文本框的内容
    </button>
    <script language="javascript">
      function copyUrl() {
     
        var input = document.getElementById("input");
        window.clipboardData.setData("Text", input.value);
        alert("复制成功!");
      }
    </script>
  </body>
</html>

2. 浏览器自带的方法实现原生 DOM 复制

效果：
React 中实现复制到剪切板功能_第2张图片
原理：

  1. 使用文本域或者输入框的 input.select() 方法。
  2. 执行浏览器的 document.execCommand("copy") 命令。
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div>
      <textarea id="input" style="width:300px;height:100px">
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Maxime expedita corporis culpa voluptates deleniti eveniet voluptatem laborum facere quos fugit, obcaecati corrupti repellat voluptatibus iste quae! Illum sint quibusdam velit?</textarea
      >
      <div><button onclick="copyText()" style="cursor: pointer;">点此复制文本框的内容</button></div>
      
    </div>
    <script>
      function copyText() {
           
        var input = document.getElementById("input");
        //input.value = text; // 修改文本框的内容
        input.select(); // 选中文本
        document.execCommand("copy"); // 执行浏览器复制命令
        alert("复制成功");
      }
    </script>
  </body>
</html>

兼容 Firefox 48.0、Chrome 60.0、IE 8 。

3. 使用 clipboard 插件

效果：
React 中实现复制到剪切板功能_第3张图片
原理：

  1. 引入 clipboard 插件。
  2. 在点击元素中，使用 data-clipboard-action 指定操作类型（copy or cut）。使用 data-clipboard-target 指定复制的目标元素。
  3. 实例化 ClipboardJS 对象，参数为点击元素的类名或者id名。
    注意：根据 clipboard 插件的版本不同，有的需要实例化 Clipboard 对象。
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div>
      <textarea id="input" style="width: 300px; height: 100px">
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Maxime expedita corporis culpa voluptates deleniti eveniet voluptatem laborum facere quos fugit, obcaecati corrupti repellat voluptatibus iste quae! Illum sint quibusdam velit?</textarea
      >
      <div>
        <button id="btn"  data-clipboard-action="copy" data-clipboard-target="#input" style="cursor: pointer">
          点此复制文本框的内容
        </button>
      </div>
    </div>
    <script src="./clipboard.js"></script>   
    <script>
      //使用 dom 属性实现复制功能
      var clipboard = new ClipboardJS("#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>
  </body>
</html>

你可能感兴趣的:(#,React,基础)

  • 参加【2025年春季】全国CTF夺旗赛-从零基础入门到竞赛，看这一篇就稳了！ 白帽子凯哥 web安全学习安全CTF夺旗赛网络安全
    基于入门网络安全/黑客打造的：黑客&网络安全入门&进阶学习资源包目录一、CTF简介二、CTF竞赛模式三、CTF各大题型简介四、CTF学习路线4.1、初期1、html+css+js（2-3天）2、apache+php（4-5天）3、mysql（2-3天）4、python(2-3天)5、burpsuite（1-2天）4.2、中期1、SQL注入（7-8天）2、文件上传（7-8天）3、其他漏洞（14-15
  • 参加【2025年春季】全国CTF夺旗赛-从零基础入门到竞赛，看这一篇就稳了！ 白帽子凯哥 web安全学习安全CTF夺旗赛网络安全
    基于入门网络安全/黑客打造的：黑客&网络安全入门&进阶学习资源包目录一、CTF简介二、CTF竞赛模式三、CTF各大题型简介四、CTF学习路线4.1、初期1、html+css+js（2-3天）2、apache+php（4-5天）3、mysql（2-3天）4、python(2-3天)5、burpsuite（1-2天）4.2、中期1、SQL注入（7-8天）2、文件上传（7-8天）3、其他漏洞（14-15
  • 深入探讨服务器虚拟化：架构、技术与应用 码上飞扬 服务器虚拟化K8SDockerXenKVM
    1.引言在现代IT基础设施中，服务器虚拟化已成为一种不可或缺的技术。它不仅提高了资源利用率，还增强了系统的灵活性和可管理性。随着企业对高效、灵活和可扩展IT环境的需求不断增加，服务器虚拟化技术的应用愈发广泛。本文将深入探讨服务器虚拟化的基本概念、架构、常见技术及其实际应用，帮助读者更好地理解这一重要技术。2.什么是服务器虚拟化？服务器虚拟化是一种将物理服务器划分为多个虚拟服务器（虚拟机，VM）的技
  • 【黑龙江乡镇界】面图层arcgis数据shp格式乡镇名称和编码wgs84无偏移内容测评 鸿业远图科技 arcgis
    本文将详细讲解与“最新黑龙江乡镇界面图层arcgis数据shp格式乡镇名称和编码wgs84无偏移”相关的知识点，包括GIS基础、ArcGIS软件、SHP文件格式、WGS84坐标系统以及乡镇行政数据的重要性。GIS基础GIS（GeographicInformationSystem，地理信息系统）是一种用于采集、存储、管理、分析和展示所有类型地理数据的系统。它整合了地图、数据库、统计分析和计算机图形等
  • Python3【字符串】：文本操作的瑞士军刀 李智 - 重庆 Python精讲精练-从入门到实战python开发语言经验分享编程实战趣味编程编程技巧
    Python3【字符串】：文本操作的瑞士军刀内容简介本系列文章是为Python3学习者精心设计的一套全面、实用的学习指南，旨在帮助读者从基础入门到项目实战，全面提升编程能力。文章结构由5个版块组成，内容层层递进，逻辑清晰。基础速通：n个浓缩提炼的核心知识点，夯实编程基础；经典范例：10个贴近实际的应用场景，深入理解Python3的编程技巧和应用方法；避坑宝典：10个典型错误解析，提供解决方案，帮助
  • python并行计算 weixin_30894389
    0.基础并行/发：multiprocessing/threading1.concurrent2.并发：asynico3.Ipython下的并行计算：使用ipyparallel库的IPython提供了前所未有的能力，将科学Python的探索能力与几乎即时访问多个计算核心相结合。系统可以直观地与本地或网络的计算节点集群进行交互，而不管集群的实现方式如何。这种易于交互使用帮助IPython和Python
  • JDK动态代理在拦截器和声明式接口中的应用 码到三十五 JAVA核心springbootspringcloud
    ❃博主首页：「码到三十五」，同名公众号:「码到三十五」，wx号:「liwu0213」☠博主专栏：♝博主的话：搬的每块砖，皆为峰峦之基；公众号搜索「码到三十五」关注这个爱发技术干货的coder，一起筑基一、动态代理概念回顾Java动态代理技术是基于反射机制的基础。核心在于利用反射机制和接口编程在运行时动态生成代理类，并通过InvocationHandler接口实现代理逻辑的灵活扩展。通过动态代理，J
  • Vue - watch() 监视属性的使用 来一碗刘肉面 Vuevue.js前端javascript
    在Vue3中，watch()是一个用于观察响应式数据的API，可以用来在数据变化时执行某些操作。它是在Vue的组合式API中使用的主要功能之一，允许在代码中细致地控制数据变化的反应。作用：监视数据的变化特点：Vue3中的watch只能监视以下四种数据：ref定义的数据reactive定义的数据函数返回一个值（getter函数）一个包含上述内容的数组基本语法：watch(source,callbac
  • 【postgresql初级使用】在表的多个频繁使用列上创建一个索引，多条件查询优化，多场景案例揭示索引失效 韩楚风 postgresql数据库sqldatabase
    多列索引专栏内容：postgresql使用入门基础手写数据库toadb并发编程个人主页：我的主页管理社区：开源数据库座右铭：天行健，君子以自强不息；地势坤，君子以厚德载物.文章目录多列索引概述多列索引创建创建语法创建说明案例分析创建数据创建索引带首列查询不带首列查询总结结尾概述
  • Python3 字典：解锁高效数据存储的钥匙 李智 - 重庆 Python精讲精练-从入门到实战python经验分享编程实战趣味编程编程技巧
    Python3字典：解锁高效数据存储的钥匙内容简介本系列文章是为Python3学习者精心设计的一套全面、实用的学习指南，旨在帮助读者从基础入门到项目实战，全面提升编程能力。文章结构由5个版块组成，内容层层递进，逻辑清晰。基础速通：n个浓缩提炼的核心知识点，夯实编程基础；经典范例：10个贴近实际的应用场景，深入理解Python3的编程技巧和应用方法；避坑宝典：10个典型错误解析，提供解决方案，帮助读
  • 车联网安全 黄一113530 网络安全网络安全渗透测试
    1、智能汽车安全如何分类？智能汽车终极发展阶段是无人驾驶，车联网则是无人驾驶实现的基础，然而车联网技术应用过程中却会带来信息安全问题，具体可分为以下三种：一、用户隐私汽车智能化是建立在车辆动态数据收集及应用上的，如车辆行驶、车体、动力、安全及环境数据等层面，尤其是车辆行驶数据一直都被视为变现的大数据金矿，无论是车联网前装的车商，还是车联网后装的互联网科技公司，都在用户不知情的情况下收集车主驾驶历史
  • 通过ChatGPT使用Mermaid.js生成时间序列图、组织结构图等 百态老人 生成式AI经验分享前端人工智能
    1、用mermaid.js生成京东网站改版时间序列图以下是使用Mermaid.js生成的京东网站改版时间序列图：gantttitle京东网站改版时间序列图dateFormatYYYY-MM-DDsection基础功能改版登录注册界面:done,2018-01-15,10d购物车页面优化:done,2018-02-10,10d商品详情页改版:done,2018-03-15,15d收银台页面改版:do
  • ARM 处理器架构【转】 weixin_33690963 嵌入式javaphp
    ARM处理器架构转自：http://www.arm.com/zh/products/processors/instruction-set-architectures/index.phpARM架构是构建每个ARM处理器的基础。ARM架构随着时间的推移不断发展，其中包含的架构功能可满足不断增长的新功能、高性能需求以及新兴市场的需要。有关最新公布版本的信息，请参阅ARMv8架构。ARM架构支持跨跃多个性
  • 使用 Docker Compose 一键启动 Redis、MySQL 和 RabbitMQ 前端 贾公子 dockerredismysql
    目录一、DockerCompose简介二、服务配置详解1.Redis配置2.MySQL配置3.RabbitMQ配置三、数据持久化与时间同步四、部署与管理五、总结目录挂载与卷映射的区别现代软件开发中，微服务架构因其灵活性和可扩展性而备受青睐。为了支持微服务的高效运行，我们需要构建一个强大且可靠的基础设施。本文将介绍如何使用DockerCompose部署Redis、MySQL和RabbitMQ，这些组
  • 【useEffect Hook】在组件中执行副作用操作 风茫 Reactreact.jsuseEffect
    引言useEffect是React中用于处理副作用的Hook，它允许你在函数组件中执行类似于类组件生命周期方法的操作。通过useEffect，你可以在组件挂载、更新和卸载时执行某些操作。常见副作用操作：AJAX请求：获取或提交数据。计时器：设置定时任务。异步操作：处理异步逻辑。更改真实的DOM对象：直接操作DOM元素。本地存储：读取或写入浏览器的本地存储。其它会对外部产生影响的操作：例如订阅事件等
  • 国际网络专线怎么开通？ 蓝讯小刘 网络
    在全球化日益加速的今天，企业越来越需要稳定、高效的网络来支撑他们的跨国业务。国际网络专线，作为外贸企业、出海企业等拓展全球业务的关键基础设施，其重要性不言而喻。那么，企业如何才能开通国际网络专线呢？本文将详细解析开通流程，帮助您的企业顺利搭建起通往国际市场的桥梁。一、选择服务商开通国际网络专线的第一步，是选择一个可靠的服务商。服务商不仅提供物理的网络连接，更应具备专业知识和技术支持，确保您的企业网
  • ESP32-C3入门教程 蓝牙篇③——基于微信小程序和Esp Blufi实现 WiFi配网 小康师兄 ESP32-C3入门教程微信小程序小程序blufiESP32WiFi配网
    基于微信小程序和EspBlufi实现WiFi配网文章目录一、前言二、软件框架三、软件流程四、API介绍五、全部源码一、前言本文基于VSCodeIDE进行编程、编译、下载、运行等操作基础入门章节请查阅：ESP32-C3入门教程基础篇①——基于VSCode构建HelloWorld教程目录大纲请查阅：ESP32-C3入门教程——导读二、软件框架
  • ESP32-C3入门教程 基础篇④——ADC（模拟量转数字量）单次读取简单实例 小康师兄 ESP32-C3入门教程ESP32ESP32-C3ADC模数转换模拟量转数字量
    文章目录一、前言二、硬件接线三、知识点3.1ADC电压范围3.2ADC精度3.3ADC校准3.4ADC读取四、全部源码五、运行演示六、参考一、前言本文基于VSCodeIDE进行编程、编译、下载、运行等操作基础入门章节请查阅：ESP32-C3入门教程基础篇①——基于VSCode构建HelloWorld教程目录大纲请查阅：ESP32-C3入门教程——导读ADC转换是将输入模拟电压转换为数字值。ADC原
  • ESP32-C3入门教程 WiFi篇⑦——基于SoftAP 的 WiFi 智能配网 小康师兄 ESP32-C3入门教程物联网esp32WiFi配网SoftAPWiFi
    文章目录一、前言二、WiFi配网方式三、功能简述四、源码实现一、前言本文基于VSCodeIDE进行编程、编译、下载、运行等操作基础入门章节请查阅：ESP32-C3入门教程基础篇①——基于VSCode构建HelloWorld教程目录大纲请查阅：ESP32-C3入门教程——导读二、WiFi配网方式WiFi配网即：用户通过App/小程序/网页等途径将WiFi的SSID和密码等信息发送给ESP32，方式有
  • 如何修改Chromium内核|浏览器指纹伪装|Puppeteer指纹|Playwright指纹- Chromium内核修改与浏览器指纹伪装方法-anti-fingerprint指纹浏览器如何搭建环境 药尘韩立 前端javascript开发语言python自动化ai
    Chromium内核是许多现代浏览器的基础，如Chrome和Edge。在进行网络爬取、自动化测试或数据挖掘等任务时，使用Puppeteer或Playwright等工具时，浏览器指纹的重要性不言而喻。本文将介绍如何修改Chromium内核以及浏览器指纹伪装的方法，以构建一个抗指纹的浏览环境。首先，了解如何修改Chromium内核是至关重要的。您可以从Chromium源代码仓库中获取最新的代码，并根据
  • solidity基础 -- 映射迭代 第十六年盛夏. Solidity区块链智能合约
    前提提要本文中出现的所有代码均可在本人GitHubGitHub--solidity学习代码中查询到基本概念在Solidity中，映射是一种非常有用的数据结构，它允许我们通过键来快速访问值。然而，映射本身是不可迭代的，这意味着我们不能直接遍历映射中的所有键值对。在某些情况下，我们需要对映射中的数据进行迭代操作，例如在处理用户余额、资产记录等场景时。为了实现映射的迭代功能，我们可以结合使用数组和映射来
  • solidity基础 -- 合约结构 第十六年盛夏. Solidity区块链智能合约
    所有本篇以及以前出现的代码均可以在本人GitHubGitHub-solidity学习代码上找到合约结构在Solidity中，合约类似于面向对象编程语言中的类。每个合约中可以包含状态变量、函数、函数修饰器、事件、结构类型、和枚举类型的声明，且合约可以从其他合约继承。状态变量状态变量是永久地存储在合约存储中的值。pragmasolidity^0.4.0;contractSimpleStorage{ui
  • ARM 处理器架构简介 ASMARM ARMARM处理器架构
    ARM架构是构建每个ARM处理器的基础。ARM架构随着时间的推移不断发展，其中包含的架构功能可满足不断增长的新功能、高性能需求以及新兴市场的需要。有关最新公布版本的信息，请参阅ARMv8架构。ARM架构支持跨跃多个性能点的实现，并已在许多细分市场中成为主导的架构。ARM架构支持非常广泛的性能点，因而可以利用最新的微架构技术获得极小的ARM处理器实现和极有效的高级设计实现。实现规模、性能和低功耗是A
  • [RHEL7基础篇-4] 用户和权限 JoveZou #RHEL7基础篇RedHatEnterpriseLinuxlinuxrhel
    [RHEL7基础篇-4]用户和权限简介用户和权限用户和组权限简介在RHEL7当中控制用户权限有DAC和ACL两种方式来控制文件或目录对于相应用户或组的权限，有的时候管理员为了系统安全往往会把root用户给藏起来，不给ssh远程登录，那时我们将使用到sudo来临时获得root用户的权限，或者通过su来切换到拥有权限的用户进行操作，该篇将会讲述用户和权限的相关配置与使用，以及如何临时获得root权限与
  • 【Origin+Python】使用External Python批量出图代码参考2 kkkkkkkkk_1201 绘图python开发语言
    目录前情提要进阶代码1批量绘制曲线图2曲线图设置3批量绘制相同设置的曲线图去除水印前情提要基础教程见链接:【Origin+Python】使用ExternalPython批量出图代码参考这里主要介绍一些进阶代码以及使用盗版origin要如何去除水印的方法！#############################################################进阶代码########
  • 浅谈Linux C基础9----数据链表 Oracle_666 linuxc语言运维
    前言:基于C语言实现数据链表1.实现代码函数:#include"loop_list.h"//创建单向循环链表node_pcreate_loop(){node_pH=(node_p)malloc(sizeof(node));if(H==NULL){printf("空间申请失败\n");returnNULL;}H->data=0;//链表中暂无数据H->next=H;//单向循环链表，尾结点指向头结点
  • selenium自动化测试01 Meng XY selenium自动化测试selenium自动化测试工具
    前言新人一个，打算写写博客，去记录个人的学习历程。花了一周的时间去学习了selenium自动化，然后记录下来，一些语法、代码之类的。文笔不是很好，一些代码标注、注释可能不是很准确，望见谅。selenium自动化测试呢我用的是Java+maven，工具是IDEA。我在学习自动化的时候用的是eclipse，我习惯用IDEA，看个人喜好了。（要有Java编程基础，Java的话可能会在后续上线，还没写）介
  • 国内的AI大模型有可能超过ChatGPT吗？ AIWritePaper官方账号 PromptChatGPTAIWritePaperchatgpt人工智能深度学习AI写作AIGC
    这是一个非常有前瞻性和现实意义的问题。要回答国内AI是否有可能超过ChatGPT，我们需要从多个方面来分析，包括技术基础、数据资源、应用场景、政策支持以及人才储备等。以下是对这一问题的详细探讨：1.技术基础（1）现状国内AI技术：国内的AI技术发展迅速，尤其在深度学习、自然语言处理（NLP）和计算机视觉等领域已经取得了显著进展。例如，百度的文心一言、阿里的通义千问等大语言模型（LLM）已经在技术上
  • 路径矢量路由协议之BGP-1基础知识 pt1043 BGP网络
    BGP（BorderGatewayProtocol，边界网关协议）是现代网络架构中几乎所有高级技术的基础，任何一项现代网络体系下的高级技术都离不开它。在学习BGP之前，需要具备一定的基础知识。基础准备：CCNA基础——至少需要一半的CCNA基础；推荐阅读《CCNA学习指南：路由和交换认证》（作者：ToddLammle）。OSPF——如果具备基本的多区域OSPF或其他IGP等理论和配置能力，将为学习
  • 詳細講一下RN(React Native)中的列表組件FlatList和SessionList asecretman! reactnativereact.jsjavascript
    1.FlatList基礎使用importReactfrom'react';import{View,Text,FlatList,StyleSheet}from'react-native';exportconstSimpleListDemo:React.FC=()=>{//1.準備數據constdata=[{id:'1',title:'項目1'},{id:'2',title:'項目2'},{id:'3
  • jQuery 跨域访问的三种方式 No 'Access-Control-Allow-Origin' header is present on the reque qiaolevip 每天进步一点点学习永无止境跨域众观千象
    XMLHttpRequest cannot load http://v.xxx.com. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63342' is therefore not allowed access. test.html:1
  • mysql 分区查询优化 annan211 java分区优化mysql
    分区查询优化 引入分区可以给查询带来一定的优势，但同时也会引入一些bug. 分区最大的优点就是优化器可以根据分区函数来过滤掉一些分区，通过分区过滤可以让查询扫描更少的数据。 所以，对于访问分区表来说，很重要的一点是要在where 条件中带入分区，让优化器过滤掉无需访问的分区。 可以通过查看explain执行计划，是否携带 partitions
  • MYSQL存储过程中使用游标 chicony Mysql存储过程
    DELIMITER $$ DROP PROCEDURE IF EXISTS getUserInfo $$ CREATE PROCEDURE getUserInfo(in date_day datetime)-- -- 实例-- 存储过程名为：getUserInfo-- 参数为：date_day日期格式:2008-03-08--    BEGINdecla
  • mysql 和 sqlite 区别 Array_06 sqlite
    转载： http://www.cnblogs.com/ygm900/p/3460663.html mysql 和 sqlite 区别 SQLITE是单机数据库。功能简约，小型化，追求最大磁盘效率 MYSQL是完善的服务器数据库。功能全面，综合化，追求最大并发效率 MYSQL、Sybase、Oracle等这些都是试用于服务器数据量大功能多需要安装，例如网站访问量比较大的。而sq
  • pinyin4j使用 oloz pinyin4j
    首先需要pinyin4j的jar包支持；jar包已上传至附件内 方法一:把汉字转换为拼音；例如：编程转换后则为biancheng      /** * 将汉字转换为全拼 * @param src 你的需要转换的汉字 * @param isUPPERCASE 是否转换为大写的拼音； true:转换为大写；fal
  • 微博发送私信 随意而生 微博
    在前面文章中说了如和获取登陆时候所需要的cookie，现在只要拿到最后登陆所需要的cookie，然后抓包分析一下微博私信发送界面 http://weibo.com/message/history?uid=****&name=**** 可以发现其发送提交的Post请求和其中的数据， 让后用程序模拟发送POST请求中的数据，带着cookie发送到私信的接入口，就可以实现发私信的功能了。
  • jsp 香水浓 jsp
    JSP初始化     容器载入JSP文件后，它会在为请求提供任何服务前调用jspInit()方法。如果您需要执行自定义的JSP初始化任务，复写jspInit()方法就行了 JSP执行     这一阶段描述了JSP生命周期中一切与请求相关的交互行为，直到被销毁。     当JSP网页完成初始化后
  • 在 Windows 上安装 SVN Subversion 服务端 AdyZhang SVN
    在 Windows 上安装 SVN Subversion 服务端2009-09-16高宏伟哈尔滨市道里区通达街291号   最佳阅读效果请访问原地址：http://blog.donews.com/dukejoe/archive/2009/09/16/1560917.aspx   现在的Subversion已经足够稳定，而且已经进入了它的黄金时段。我们看到大量的项目都在使
  • android开发中如何使用 alertDialog从listView中删除数据？ aijuans android
    我现在使用listView展示了很多的配置信息，我现在想在点击其中一条的时候填出 alertDialog,点击确认后就删除该条数据，（ ArrayAdapter ，ArrayList，listView 全部删除），我知道在 下面的onItemLongClick 方法中 参数 arg2  是选中的序号，但是我不知道如何继续处理下去 1 2 3
  • jdk-6u26-linux-x64.bin 安装 baalwolf linux
    1.上传安装文件(jdk-6u26-linux-x64.bin) 2.修改权限 [root@localhost ~]# ls -l /usr/local/jdk-6u26-linux-x64.bin 3.执行安装文件 [root@localhost ~]# cd /usr/local [root@localhost local]# ./jdk-6u26-linux-x64.bin&nbs
  • MongoDB经典面试题集锦 BigBird2012 mongodb
    1.什么是NoSQL数据库？NoSQL和RDBMS有什么区别？在哪些情况下使用和不使用NoSQL数据库？ NoSQL是非关系型数据库，NoSQL = Not Only SQL。 关系型数据库采用的结构化的数据，NoSQL采用的是键值对的方式存储数据。 在处理非结构化/半结构化的大数据时；在水平方向上进行扩展时；随时应对动态增加的数据项时可以优先考虑使用NoSQL数据库。 在考虑数据库的成熟
  • JavaScript异步编程Promise模式的6个特性 bijian1013 JavaScriptPromise
            Promise是一个非常有价值的构造器，能够帮助你避免使用镶套匿名方法，而使用更具有可读性的方式组装异步代码。这里我们将介绍6个最简单的特性。         在我们开始正式介绍之前，我们想看看Javascript Promise的样子： var p = new Promise(function(r
  • [Zookeeper学习笔记之八]Zookeeper源代码分析之Zookeeper.ZKWatchManager bit1129 zookeeper
    ClientWatchManager接口 //接口的唯一方法materialize用于确定那些Watcher需要被通知 //确定Watcher需要三方面的因素1.事件状态 2.事件类型 3.znode的path public interface ClientWatchManager { /** * Return a set of watchers that should
  • 【Scala十五】Scala核心九：隐式转换之二 bit1129 scala
    隐式转换存在的必要性，   在Java Swing中，按钮点击事件的处理，转换为Scala的的写法如下：   val button = new JButton button.addActionListener( new ActionListener { def actionPerformed(event: ActionEvent) {
  • Android JSON数据的解析与封装小Demo ronin47
    转自：http://www.open-open.com/lib/view/open1420529336406.html package com.example.jsondemo; import org.json.JSONArray; import org.json.JSONException; import org.json.JSONObject;    impor
  • [设计]字体创意设计方法谈 brotherlamp UIui自学ui视频ui教程ui资料
      从古至今，文字在我们的生活中是必不可少的事物，我们不能想象没有文字的世界将会是怎样。在平面设计中，UI设计师在文字上所花的心思和功夫最多，因为文字能直观地表达UI设计师所的意念。在文字上的创造设计，直接反映出平面作品的主题。 如设计一幅戴尔笔记本电脑的广告海报，假设海报上没有出现“戴尔”两个文字，即使放上所有戴尔笔记本电脑的图片都不能让人们得知这些电脑是什么品牌。只要写上“戴尔笔
  • 单调队列-用一个长度为k的窗在整数数列上移动，求窗里面所包含的数的最大值 bylijinnan java算法面试题
    import java.util.LinkedList; /* 单调队列 滑动窗口 单调队列是这样的一个队列：队列里面的元素是有序的，是递增或者递减 题目：给定一个长度为N的整数数列a(i),i=0,1,...,N-1和窗长度k. 要求：f(i) = max{a(i-k+1),a(i-k+2),..., a(i)},i = 0,1,...,N-1 问题的另一种描述就
  • struts2处理一个form多个submit chiangfai struts2
    web应用中，为完成不同工作，一个jsp的form标签可能有多个submit。如下代码： <s:form action="submit" method="post" namespace="/my"> <s:textfield name="msg" label="叙述：">
  • shell查找上个月，陷阱及野路子 chenchao051 shell
    date -d "-1 month" +%F     以上这段代码，假如在2012/10/31执行，结果并不会出现你预计的9月份，而是会出现八月份，原因是10月份有31天，9月份30天，所以-1 month在10月份看来要减去31天，所以直接到了8月31日这天，这不靠谱。     野路子解决：假设当天日期大于15号
  • mysql导出数据中文乱码问题 daizj mysql中文乱码导数据
    解决mysql导入导出数据乱码问题方法： １、进入mysql，通过如下命令查看数据库编码方式： mysql>  show variables like 'character_set_%'; +--------------------------+----------------------------------------+ | Variable_name&nbs
  • SAE部署Smarty出现：Uncaught exception 'SmartyException' with message 'unable to write dcj3sjt126com PHPsmartysae
      对于SAE出现的问题：Uncaught exception 'SmartyException' with message 'unable to write file...。 官方给出了详细的FAQ：http://sae.sina.com.cn/?m=faqs&catId=11#show_213 解决方案为：   01 $path 
  • 《教父》系列台词 dcj3sjt126com
    Your love is also your weak point. 你的所爱同时也是你的弱点。   If anything in this life is certain, if history has taught us anything, it is that you can kill anyone.   不顾家的人永远不可能成为一个真正的男人。 &
  • mongodb安装与使用 dyy_gusi mongo
    一.MongoDB安装和启动,widndows和linux基本相同 1.下载数据库,     linux:mongodb-linux-x86_64-ubuntu1404-3.0.3.tgz 2.解压文件,并且放置到合适的位置     tar -vxf mongodb-linux-x86_64-ubun
  • Git排除目录 geeksun git
    在Git的版本控制中，可能有些文件是不需要加入控制的，那我们在提交代码时就需要忽略这些文件，下面讲讲应该怎么给Git配置一些忽略规则。   有三种方法可以忽略掉这些文件，这三种方法都能达到目的，只不过适用情景不一样。 1.  针对单一工程排除文件 这种方式会让这个工程的所有修改者在克隆代码的同时，也能克隆到过滤规则，而不用自己再写一份，这就能保证所有修改者应用的都是同一
  • Ubuntu 创建开机自启动脚本的方法 hongtoushizi ubuntu
    转载自： http://rongjih.blog.163.com/blog/static/33574461201111504843245/ Ubuntu 创建开机自启动脚本的步骤如下： 1) 将你的启动脚本复制到 /etc/init.d目录下 以下假设你的脚本文件名为 test。   2) 设置脚本文件的权限 $ sudo chmod 755
  • 第八章 流量复制/AB测试/协程 jinnianshilongnian nginxluacoroutine
    流量复制 在实际开发中经常涉及到项目的升级，而该升级不能简单的上线就完事了，需要验证该升级是否兼容老的上线，因此可能需要并行运行两个项目一段时间进行数据比对和校验，待没问题后再进行上线。这其实就需要进行流量复制，把流量复制到其他服务器上，一种方式是使用如tcpcopy引流；另外我们还可以使用nginx的HttpLuaModule模块中的ngx.location.capture_multi进行并发
  • 电商系统商品表设计 lkl
    DROP TABLE IF EXISTS `category`; -- 类目表 /*!40101 SET @saved_cs_client = @@character_set_client */; /*!40101 SET character_set_client = utf8 */; CREATE TABLE `category` ( `id` int(11) NOT NUL
  • 修改phpMyAdmin导入SQL文件的大小限制 pda158 sqlmysql
    　用phpMyAdmin导入mysql数据库时，我的10M的 数据库不能导入，提示mysql数据库最大只能导入2M。 　　 phpMyAdmin数据库导入出错： 　　You probably tried to upload too large file. Please refer to documentation for ways to workaround this limit.
  • Tomcat性能调优方案 Sobfist apachejvmtomcat应用服务器
    一、操作系统调优 对于操作系统优化来说，是尽可能的增大可使用的内存容量、提高CPU的频率，保证文件系统的读写速率等。经过压力测试验证，在并发连接很多的情况下，CPU的处理能力越强，系统运行速度越快。。 【适用场景】 任何项目。 二、Java虚拟机调优 应该选择SUN的JVM，在满足项目需要的前提下，尽量选用版本较高的JVM，一般来说高版本产品在速度和效率上比低版本会有改进。 J
  • SQLServer学习笔记 vipbooks 数据结构xml
    1、create database school 创建数据库school 2、drop database school 删除数据库school 3、use school 连接到school数据库，使其成为当前数据库 4、create table class(classID int primary key identity not null) 创建一个名为class的表，其有一
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他