简明编程
简明编程

前端系列——HTML5，Vue拖拽

前端系列——HTML5，Vue拖拽

  • HTML5拖拽
    • 拖拽目标触发的事件
    • 释放目标时触发的事件
    • 阻止默认事件方法执行
    • DataTransfer传递媒介
      • 方法
        • 设置自身
        • 设置图像
    • 示例代码1
      • 效果截图
    • 示例代码2
      • 效果截图
  • Vue-Draggable插件拖拽
    • 文档
    • 安装
    • 导入

HTML5拖拽

使用属性draggable即可实现对于元素的拖拽

<div draggable="true" id="test1"></div>

前端系列——HTML5，Vue拖拽_第1张图片

拖拽目标触发的事件

  1. ondragstart: 开始拖拽触发
  2. ondrag: 正在拖拽触发
  3. ondragend: 结束拖拽触发

释放目标时触发的事件

  1. ondragenter：进入容器内触发
  2. ondragover：拖动对象在另一个对象容器范围内触发
  3. ondragleave：拖动对象离开容器触发
  4. ondrop：释放鼠标触发

阻止默认事件方法执行

Event.preventDefault()

阻止默认的些事件方法等执行。在ondragover中一 定要执行preventDefault(), 否则ondrop事件不会被触
另外，如果是从其他应用软件或是文件中拖东西进来，尤其是图片的时候,默认的动作是显示这个图片或是相关信息，还是真的执行drop。此时需要用document的ondragover事件把它直接干掉

DataTransfer传递媒介

Event.dataTransfer()

用于保存拖动并放下过程中的数据

方法

  1. setData(type,data)：声明所发送的数据与类型
  2. getData(type)：返回指定类型的数据
  3. clearData(type)：删除指定类型的数据
  4. setDragImage(ImageObject,x,y)：设置鼠标选中图像

设置自身

event.dataTransfer().setDragImage(event.target,0,10)

设置图像

const image = new Image()
image.src = '图片位置'
event.dataTransfer().setDragImage(image,0,10)

示例代码1

DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Documenttitle>
  <style>
    #test1{
      height: 50px;
      width: 60px;
      background-color: #ff00ff;
    }
    #wrap{
      position: absolute;
      top: 20%;
      left: 200px;
      height: 150px;
      width: 152px;
      border: 3px solid #ff00ff;
    }
  style>
head>
<body>
  <div draggable="true" id="test1">div>
  <div id="wrap">

  div>
  <script>
    var test1 = document.getElementById('test1');
    var wrap = document.getElementById('wrap');
    test1.ondragstart = ()=>{
      console.log('drag start')
    }
    test1.ondrag=()=>{
      console.log('draging')
    }
    test1.ondragend=()=>{
      console.log('drag end')
    }

    wrap.addEventListener('dragenter',()=>{
      console.log('ondragenter')
    })
    wrap.addEventListener('dragover',(event)=>{
      event.preventDefault()
      console.log('ondragover')
    })
    wrap.addEventListener('dragleave',()=>{
      console.log('ondragleave')
    })
    wrap.addEventListener('drag',()=>{
      console.log('ondrag')
    })
  script>
body>
html>

效果截图

前端系列——HTML5，Vue拖拽_第2张图片

前端系列——HTML5，Vue拖拽_第3张图片

示例代码2

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    #wrap1{
      position: absolute;
      top: 20px;
      left: 20px;
      height: 200px;
      width: 200px;
    }
    ul{
      height: 200px;
      width: 300px;
    }
    li{
      height: 30px;
      background-color: antiquewhite;
      margin: 5px;
      width: 200px;
    }
    #wrap2{
      height: 200px;
      width: 300px;
      position: absolute;
      top: 200px;
      left: 400px;
      border: 2px solid #fff00f;
    }
  </style>
</head>
<body>
  <div id="wrap1">
    <ul id="u1">
      <li draggable="true">1</li>
      <li draggable="true">2</li>
      <li draggable="true">3</li>
      <li draggable="true">4</li>
    </ul>
  </div>
  <div id="wrap2">
    <ul id="ul2"></ul>
  </div>
  <script>
    var dragItemList = document.querySelectorAll('li')
    var dragItem = null
    var wrap = document.getElementById('ul2')
    for(let i = 0;i < dragItemList.length;i++){
      dragItemList[i].ondragstart = (event)=>{
       
        dragItem = dragItemList[i]
        console.log(dragItem)
  

      }
    }
    wrap.ondragover=(event)=>{
      event.preventDefault()
    }
    wrap.ondrop=()=>{
      console.log(dragItem)
      wrap.appendChild(dragItem)
    }
  </script>
</body>
</html>

效果截图

前端系列——HTML5，Vue拖拽_第4张图片

Vue-Draggable插件拖拽

最简单的一类插件了，有一点基础的根本不用学，直接看文档

文档

github
点击进行案例尝试

安装

npm i -S vuedraggable

导入

<draggable v-model="myArray" group="people" @start="drag=true" @end="drag=false">
   <div v-for="element in myArray" :key="element.id">{{element.name}}</div>
</draggable>

import draggable from 'vuedraggable'

export default {
        components: {
            draggable,
        },

你可能感兴趣的:(笔记,vue,前端,html,html5,vue,vue-draggable,draggable)

  • 前端包管理工具哪家强？npm、Yarn、pnpm 大比拼 Forever丿顾北 bolg前端npmarcgis
    前言在前端开发的世界里，包管理工具就像是我们的得力助手，帮助我们轻松管理项目中的各种依赖包。npm、Yarn和pnpm是目前最常用的三个包管理工具，它们各有千秋，也让不少小伙伴在选择时犯了难。今天，咱们就来详细唠唠这三个工具，看看谁才是最适合你的那一个！**一、npm：前端包管理的“老大哥”1.npm是什么？npm，全称NodePackageManager，是Node.js官方的包管理工具，就像N
  • 前端权限控制：深入理解与实现RBAC模型
    什么是RBAC？RBAC（Role-BasedAccessControl，基于角色的访问控制）是一种广泛应用于系统权限管理的模型。它将权限与角色关联，用户通过被分配适当的角色来获得相应的权限，而不是直接将权限分配给用户。在前端领域，RBAC模型帮助我们实现：界面的动态渲染（不同角色看到不同UI）路由访问控制操作权限校验数据展示过滤前端RBAC的核心概念1.用户(User)系统的使用者，可以拥有一个
  • 20180818《遇见心想事成的自己》读书笔记 苗苗聊成长
    读书时间：20180813-20180818此书主要分为两部分，第一部分是心想事成的秘密，第二部分是秘密后的秘密。看到这两个主题就想起，曾经有些时候，也会期盼着能够心想事成，让自己在困境中突围，然而往往不管用，上天总是不会给到你想要的东西。看了此书才恍然大悟，原来心想事成也有方法，也讲套路。秘密后的秘密，才是核心。在这个快餐式的时代，很多时候我们只学一些表面上的术，就想达成所愿，化解一切难题，往往
  • Flutter基础（前端教程①⑦-Column竖直-Row水平-Warp包裹-Stack堆叠） aaiier Flutterflutter
    MainAxisAlignment是一个枚举类，用于控制主轴（MainAxis）方向上子组件的排列和对齐方式。MainAxisAlignment的常用取值及效果：MainAxisAlignment.start子组件沿主轴的起点对齐（Row左对齐，Column顶部对齐）MainAxisAlignment.end子组件沿主轴的终点对齐（Row右对齐，Column底部对齐）MainAxisAlignme
  • HCIP第一、二章笔记整理 aaaBsBsBsB 笔记网络tcp/ip
    第一章：TCP协议的扩展一、面向连接点到点：TCP通讯中仅存在通讯双方，无第三方。连接性质：非物理链路上的连接，而是逻辑上的连接。二、TCP的报文结构核心字段：包括源端口号（16位）、目标端口号（16位）、序列号（32位）、确认应答号（32位）、首部长度（4位）、保留位（6位）、标记位（如SYN、ACK、RST等）、窗口大小（16位）、校验和（16位）、紧急指针（16位）、选项（可变长度）及数据。
  • HCIP第一天课程笔记整理 搞IT的马哥 IP网络网络协议tcp/ip服务器
    HCIP----huawei认证高级工程师抽象语言先转化成编码编码一定要转化成二进制（为什么一定要转化成二进制？）二进制信号转化成电信号处理电信号（协议等同于标准，目的就是提升服务）（1876年电话诞生，1946年第一台电子计算机诞生）OSI参考模型---OSI/RM---ISO（国际标准化组织）---1979年颁布开放式系统互联参考模型（应表会传网数物）应用层---提供各种应用服务，将抽象语言转
  • 前端包管理工具深度对比：npm、yarn、pnpm 全方位解析 斯~内克 Webpack前端npmnode.js
    前言：为什么我们需要包管理工具？在现代前端开发中，模块化已成为标配。一个中型项目可能依赖数百个第三方包，手动管理这些依赖几乎是不可能的任务。包管理工具应运而生，它们不仅解决了依赖安装问题，还提供了版本控制、脚本执行、依赖分析等强大功能。目前主流的前端包管理工具主要有三个：npm、yarn和pnpm。本文将从多个维度深入分析它们的异同，帮助你做出最适合的选择。一、历史背景与演进1.npm(NodeP
  • 打造完美Web登录界面：HTML、CSS与Bootstrap实战 Suvo Sarkar
    本文还有配套的精品资源，点击获取简介：登录界面是用户与Web应用程序互动的起点，其设计和实现对用户体验至关重要。本教程将指导开发者如何使用HTML、CSS和Bootstrap框架创建一个功能齐全且视觉吸引力强的登录界面。内容涵盖从基础的表单标签到使用Bootstrap的响应式设计，以及如何结合JavaScript和后端技术来增强界面的业务逻辑和用户验证功能。1.HTML表单标签基础HTML表单标签
  • 【Linux系列】rsync和mv 檀越@新空间 s5Linux学习linux服务器java
    博客目录1.操作性质不同2.对源文件的影响3.使用场景4.示例对比使用`rsync-a`：使用`mv`：5.注意事项总结rsync-a/data/software/build0713/dist//usr/share/nginx/html/和mv是两种完全不同的操作，主要区别如下：1.操作性质不同rsync-a复制同步：将源目录（/data/software/build0713/dist/）的内容递
  • web登录注册页面 m0_67391518 面试学习路线阿里巴巴前端javahtmlmysql数据库
    目录web登录注册页面效果图结构图Java代码User.javaUserMapper.javaIndexServlet.javaRegisterServlet.javaDButil.javaxml配置文件mybatis-config.xmldb.propertiesweb.xmlhtml与cssindex.jspindex.cssregister.htmlregister.css文章目录web登录
  • 小红书增加曝光率晓谈 小红书_46f9
    小红书目前来说的话，主要是依靠内容口碑模式，社群类型营销，笔记，类似于大众电商类型，但是我个人觉得小红书更有优势，以下是我发过的一些操作推广小技巧可以了解下。推广大致大家都大同小异，我只能给予一些适当帮助，如有推广业务需求可以随时私聊我。以下是我个人一些增加曝光率一些方式1：过硬的内容加上适当的曝光，点赞，评论，收藏，转发，等于文章的热度与曝光率2：内容过硬的同时，文章也需要注意一下排版，底色，文
  • 简单WEB登录页面代码实现 逆流的飞鱼 简单代码java
    longin.html：登录页面，此处action引用**/**类型的地址，JSP可以用${pageContext.request.contextPath}/LS用户名:密码：LoginServlet.java用户和前台WEB页面数据进行交互packageit.tongyou.web.servlet;importjava.io.IOException;importjava.io.PrintWrit
  • BootstrapValidator表单验证效果无效，不验证 蓝色天空的银码星 技术问题表单验证网页前端
    BootstrapValidator是一款非常好用的前端验证插件，但是因为很多问题，一直没有效果。果然不是代码问题，而是因为Bootstrap版本和BootstrapValidator的版本问题。下载地址：https://download.csdn.net/download/weixin_37674052/11175279首先贴出来我的引用的文件代码表单代码：要用BootstrapValidato
  • CA复习功课 陈小铃子 linux运维服务器云原生
    RHCSA复习笔记（完善版）一、文件管理创建文件/目录：touch[文件名]：创建空文件或更新现有文件时间戳。mkdir[目录名]：创建目录。常用选项：-p递归创建多级目录。查看文件/目录：ls[选项][文件/目录]：列出目录内容。常用选项：-l详细列表，-a显示隐藏文件，-h人性化大小显示。cat[文件名]：查看文件内容（小文件），无法翻页。less[文件名]：分页查看文件内容，支持搜索（/），
  • 《自由人生》读书笔记 2 西红柿阿达
    原文:问题：“人生有何意义？”其实这个问题是容易解答的。人生的意义全是各人自己寻出来，造出来的：高尚、卑劣、清贵、污浊、有用、无用……全靠自己的作为。生命本身不过是一件生物学的事实，有什么意义可说？生一个人与一只猫、一只狗，有什么分别？人生的意义不在于何以有生，而在于自己怎样生活。你若情愿把这六尺之躯葬送在白昼做梦之上，那就是你这一生的意义。你若发愤振作起来，决心去寻求生命的意义，去创造自己的生命
  • C练题笔记之：牛客-HJ012.字符串反转
    题目：描述接受一个只包含小写字母的字符串，然后输出该字符串反转后的字符串。（字符串长度不超过1000）输入描述：输入一行，为一个只包含小写字母的字符串。输出描述：输出该字符串反转后的字符串。示例1输入：abcd复制输出：dcba结果：解题思路：获取字符串，用双指针，一头一尾开始交换，直至到中间。代码：#include#includeintmain(){charstr[1024]={};scanf(
  • STM32F4-ETH通信（lwip）——学习笔记_stm32 lwip 2401_84010497 程序员嵌入式
    7、CSMA/CD冲突检测：8、MAC子层：MAC数据包、MAC数据包格式、MAC地址：MAC地址由48位数字组成，它是网卡的物理地址，在以太网传输的最底层，就是根据MAC地址来收发数据的。部分MAC地址用于广播和多播，在同一个网络里不能有两个相同的MAC地址。PC的网卡在出厂时已经设置好了MAC地址，但也可以通过一些软件来进行修改，在嵌入式的以太网控制器中可由程序进行配置。数据包中的DA是目标地
  • 日更92/365：我为什么要写作？ 富足的徐欢
    我为什么要写作？这是真是一个好问题，若在做一件事情之前，知道自己的目标动机和需求，才能排序，分配好自己的时间。余生我想把写作当成我的习惯，因为在写作上面我可以有下面三个方面的提升：1.整理笔记有时，我们听完一堂课，会感觉到心潮澎湃，可是若没有把它整理成笔记或写践行清单，假以时日，这些没有被运用或链接的知识信息会在大脑处抹去。所以整理笔记是最优的辅助学习方法。2.梳理情绪相信大家都有这种体验，当我们
  • 解决修改android手机设置中字体大小后系统布局混乱的方法 f44148db1e8c
    均属于笔记，仅供个人参考，有问题欢迎指正重写getResources方法@OverridepublicResourcesgetResources(){//returnsuper.getResources();//解决修改android手机设置中字体大小后系统布局混乱的方法，重构getResources，修改系统倍数对应用内sp的影响；Resourcesres=super.getResources(
  • 机器学习数据预处理阶段为什么需要——归一化处理
    参考：https://www.cnblogs.com/bjwu/p/8977141.html通常，在DataScience中，预处理数据有一个很关键的步骤就是数据的标准化。这里主要引用sklearn文档中的一些东西来说明，主要把各个标准化方法的应用场景以及优缺点总结概括，以来充当笔记。提升模型精度在机器学习算法的目标函数(例如SVM的RBF内核或线性模型的l1和l2正则化)，许多学习算法中目标函数
  • 读书笔记||《焦虑者自救手册》（二） 徐小胖杂谈
    书名：《焦虑者自救手册》阅读进度：43-83页阅读时间：30分钟阅读思考问题：1、关于忧虑的5种积极信念2、列举一个你的忧虑案例，用以上的五种积极信念进行分析，看看你赞成哪种或者哪几种信念？3、对忧虑进行审判时，我们通常需要扮演哪三种角色？4、用你自己忧虑的一个例子，分别用辩方律师和公诉律师的角度，为它辩护，写下证词。5、最终经过以上辩护，你将得出怎样的判决？金句摘抄：1、如果你对某件事感到忧虑，
  • Python 解析 PDF 文件的基础方法 电脑维修员xy pythonpdf前端
    ```htmlPython解析PDF文件的基础方法Python解析PDF文件的基础方法在现代数据处理和信息提取任务中，PDF文件是一种常见的文档格式。然而，PDF文件的结构复杂且难以直接解析，尤其是当需要从中提取文本或数据时。幸运的是，Python提供了多种强大的库来帮助我们轻松地解析PDF文件。1.PyPDF2库PyPDF2是一个功能强大的Python库，用于处理PDF文件。它可以读取、分割、合
  • Vue 3 组合式 API 中的组件生命周期函数详解 码力无边-OEC Vuevue.js前端javascript前端框架web
    Vue3组合式API中的组件生命周期函数详解Vue3引入了组合式API（CompositionAPI），相比于选项式API（OptionsAPI），它更加灵活且易于复用。在组件的开发中，生命周期函数是必不可少的一部分，用于在特定的阶段执行逻辑操作。本文将详细讲解Vue3组合式API的生命周期函数及其相关知识点，并通过语法糖实现相关示例。什么是生命周期函数？Vue组件从创建到销毁的过程中，会经历一系
  • 如何区分Bug是前端问题还是后端问题？ 海姐软件测试 缺陷管理bug前端
    在软件测试中，精准定位Bug的归属（前端or后端）是高效协作的关键。以下是系统化的排查方法，结合技术细节和实战技巧：1.核心判断逻辑「数据vs展示」二分法：后端问题：数据本身错误（API返回错误数据/逻辑错误/数据库问题）前端问题：数据正确但展示异常（UI渲染错误/交互逻辑问题）2.四步定位法第一步：抓包分析（必做）工具：ChromeDevTools>Network/Fiddler/Charles
  • 前端Vue自定义顶部搜索框 热门搜索 历史搜索 用于搜索跳转使用 前端组件分享
    前端Vue自定义顶部搜索框热门搜索历史搜索用于搜索跳转使用，下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id=13128效果图如下：####自定义顶部搜索框用于搜索跳转使用方法```使用方法```####HTML代码实现部分```htmlimportCCBProjectListfrom'../../components/CCPro
  • 京东618大额券怎么领？京东有大额优惠券吗？ 直返APP淘客项目
    京东618购物节：解锁APP直返大额券，畅享购物狂欢京东618购物节，这场年度购物盛宴，无疑是每一位消费者心中的期盼。在这场盛宴中，大额优惠券如同宝藏一般，等待着精明的你去发掘。而掌握领取大额券的秘诀，将让你的购物之旅更加畅快淋漓，尤其是当你充分利用京东APP的优势时。一、如何在京东APP轻松领取大额券？月入十万必看！都在挣钱！推荐几个月入几千到几万的靠谱副业项目！（公众号：善士思维笔记）返利就用
  • “重复”定义函数的睿智(Python/与ai助手“智普清言”深度交流) 梦幻精灵_cq 笔记学习
    镜像双胞谬重复，定制便捷巧活工。  笔记模板由python脚本于2025-07-1612:16:30创建，本篇笔记适合至少通晓一门语言，熟悉基本编程范式的coder翻阅。学习的细节是欢悦的历程  博客的核心价值：在于输出思考与经验，而不仅仅是知识的简单复述。Python官网：  这里，才python前沿。英文原版，原汁原味，才是寻根溯源的正统。地址：https://www.python.org/F
  • 偶拾《退让》，一阙仿七律带出的文化思考(中文诗创作) 梦幻精灵_cq 笔记学习
    礼貌温言沐春风，谦让理解通彼此。  笔记模板由python脚本于2025-07-0111:29:03创建，本篇笔记适合喜欢中文仿古七言诗的coder翻阅。学习的细节是欢悦的历程  博客的核心价值：在于输出思考与经验，而不仅仅是知识的简单复述。Python官网：  这里，才python前沿。英文原版，原汁原味，才是寻根溯源的正统。地址：https://www.python.org/Free：  大咖
  • iOS WebView 调试实战 localStorage 与 sessionStorage 同步问题全流程排查 2501_91591841 ios小程序uni-appiphoneandroidwebviewhttps
    在混合开发项目中，localStorage和sessionStorage常被前端用来临时存储用户状态、页面标记等数据。但这些Web存储在iOSWebView中并不总是如预期稳定，有时会出现数据“存了又丢”、“刷新后状态消失”、甚至“另一个标签页取不到值”等异常，调试难度极高。本文以真实案例为基础，分享如何通过实际流程和工具协作，最终定位存储问题根因并制定稳定方案。一、典型用户反馈：刷新页面后状态消
  • python爬大学生就业信息报告_Python语言爬虫——Python 岗位分析报告 weixin_39578457
    本文主要向大家介绍了Python语言爬虫——Python岗位分析报告，通过具体的内容向大家展示，希望对大家学习Python语言有所帮助。前两篇我们分别爬取了糗事百科和妹子图网站，学习了Requests,BeautifulSoup的基本使用。不过前两篇都是从静态HTML页面中来筛选出我们需要的信息。这一篇我们来学习下如何来获取Ajax请求返回的结果。本篇以拉勾网为例来说明一下如何获取Ajax请求内容
  • PHP，安卓，UI，java，linux视频教程合集 cocos2d-x小菜 javaUIlinuxPHPandroid
    ╔-----------------------------------╗┆                           
  • zookeeper admin 笔记 braveCS zookeeper
      Required Software 1) JDK>=1.6 2)推荐使用ensemble的ZooKeeper(至少3台)，并run on separate machines 3)在Yahoo!，zk配置在特定的RHEL boxes里，2个cpu，2G内存，80G硬盘   数据和日志目录 1)数据目录里的文件是zk节点的持久化备份，包括快照和事务日
  • Spring配置多个连接池 easterfly spring
    项目中需要同时连接多个数据库的时候，如何才能在需要用到哪个数据库就连接哪个数据库呢？ Spring中有关于dataSource的配置：     <bean id="dataSource" class="com.mchange.v2.c3p0.ComboPooledDataSource"   &nb
  • Mysql 171815164 mysql
    例如，你想myuser使用mypassword从任何主机连接到mysql服务器的话。 GRANT ALL PRIVILEGES ON *.* TO 'myuser'@'%'IDENTIFIED BY 'mypassword' WI TH GRANT OPTION; 如果你想允许用户myuser从ip为192.168.1.6的主机连接到mysql服务器，并使用mypassword作
  • CommonDAO（公共/基础DAO） g21121 DAO
            好久没有更新博客了，最近一段时间工作比较忙，所以请见谅，无论你是爱看呢还是爱看呢还是爱看呢，总之或许对你有些帮助。         DAO(Data Access Object)是一个数据访问（顾名思义就是与数据库打交道）接口，DAO一般在业
  • 直言有讳 永夜-极光 感悟随笔
      1.转载地址:http://blog.csdn.net/jasonblog/article/details/10813313   精华: “直言有讳”是阿里巴巴提倡的一种观念，而我在此之前并没有很深刻的认识。为什么呢？就好比是读书时候做阅读理解，我喜欢我自己的解读，并不喜欢老师给的意思。在这里也是。我自己坚持的原则是互相尊重，我觉得阿里巴巴很多价值观其实是基本的做人
  • 安装CentOS 7 和Win 7后，Win7 引导丢失 随便小屋 centos
    一般安装双系统的顺序是先装Win7，然后在安装CentOS，这样CentOS可以引导WIN 7启动。但安装CentOS7后，却找不到Win7 的引导，稍微修改一点东西即可。 一、首先具有root 的权限。      即进入Terminal后输入命令su，然后输入密码即可 二、利用vim编辑器打开/boot/grub2/grub.cfg文件进行修改 v
  • Oracle备份与恢复案例 aijuans oracle
    Oracle备份与恢复案例 一. 理解什么是数据库恢复当我们使用一个数据库时，总希望数据库的内容是可靠的、正确的，但由于计算机系统的故障（硬件故障、软件故障、网络故障、进程故障和系统故障）影响数据库系统的操作，影响数据库中数据的正确性，甚至破坏数据库，使数据库中全部或部分数据丢失。因此当发生上述故障后，希望能重构这个完整的数据库，该处理称为数据库恢复。恢复过程大致可以分为复原(Restore)与
  • JavaEE开源快速开发平台G4Studio v5.0发布 無為子
      我非常高兴地宣布,今天我们最新的JavaEE开源快速开发平台G4Studio_V5.0版本已经正式发布。   访问G4Studio网站 http://www.g4it.org   2013-04-06 发布G4Studio_V5.0版本 功能新增 (1). 新增了调用Oracle存储过程返回游标，并将游标映射为Java List集合对象的标
  • Oracle显示根据高考分数模拟录取 百合不是茶 PL/SQL编程oracle例子模拟高考录取学习交流
    题目要求: 1,创建student表和result表 2,pl/sql对学生的成绩数据进行处理 3,处理的逻辑是根据每门专业课的最低分线和总分的最低分数线自动的将录取和落选     1,创建student表,和result表 学生信息表; create table student( student_id number primary key,--学生id
  • 优秀的领导与差劲的领导 bijian1013 领导管理团队
    责任 优秀的领导：优秀的领导总是对他所负责的项目担负起责任。如果项目不幸失败了，那么他知道该受责备的人是他自己，并且敢于承认错误。 差劲的领导：差劲的领导觉得这不是他的问题，因此他会想方设法证明是他的团队不行，或是将责任归咎于团队中他不喜欢的那几个成员身上。 努力工作 优秀的领导：团队领导应该是团队成员的榜样。至少，他应该与团队中的其他成员一样努力工作。这仅仅因为他
  • js函数在浏览器下的兼容 Bill_chen jquery浏览器IEDWRext
      做前端开发的工程师，少不了要用FF进行测试，纯js函数在不同浏览器下，名称也可能不同。对于IE6和FF，取得下一结点的函数就不尽相同：   IE6：node.nextSibling,对于FF是不能识别的；   FF：node.nextElementSibling,对于IE是不能识别的； 兼容解决方式：var Div = node.nextSibl
  • 【JVM四】老年代垃圾回收：吞吐量垃圾收集器(Throughput GC) bit1129 垃圾回收
    吞吐量与用户线程暂停时间   衡量垃圾回收算法优劣的指标有两个： 吞吐量越高，则算法越好 暂停时间越短，则算法越好 首先说明吞吐量和暂停时间的含义。   垃圾回收时，JVM会启动几个特定的GC线程来完成垃圾回收的任务，这些GC线程与应用的用户线程产生竞争关系，共同竞争处理器资源以及CPU的执行时间。GC线程不会对用户带来的任何价值，因此，好的GC应该占
  • J2EE监听器和过滤器基础 白糖_ J2EE
    Servlet程序由Servlet，Filter和Listener组成，其中监听器用来监听Servlet容器上下文。 监听器通常分三类：基于Servlet上下文的ServletContex监听，基于会话的HttpSession监听和基于请求的ServletRequest监听。   ServletContex监听器 ServletContex又叫application
  • 博弈AngularJS讲义(16) - 提供者 boyitech jsAngularJSapiAngularProvider
      Angular框架提供了强大的依赖注入机制，这一切都是有注入器(injector)完成. 注入器会自动实例化服务组件和符合Angular API规则的特殊对象，例如控制器，指令，过滤器动画等。   那注入器怎么知道如何去创建这些特殊的对象呢？ Angular提供了5种方式让注入器创建对象，其中最基础的方式就是提供者(provider), 其余四种方式(Value, Fac
  • java-写一函数f(a,b)，它带有两个字符串参数并返回一串字符，该字符串只包含在两个串中都有的并按照在a中的顺序。 bylijinnan java
    public class CommonSubSequence { /** * 题目：写一函数f(a,b)，它带有两个字符串参数并返回一串字符，该字符串只包含在两个串中都有的并按照在a中的顺序。 * 写一个版本算法复杂度O(N^2)和一个O(N) 。 * * O(N^2)：对于a中的每个字符，遍历b中的每个字符，如果相同，则拷贝到新字符串中。 * O(
  • sqlserver 2000 无法验证产品密钥 Chen.H sqlwindowsSQL ServerMicrosoft
    在 Service Pack 4 (SP 4), 是运行 Microsoft Windows Server 2003、 Microsoft Windows Storage Server 2003 或 Microsoft Windows 2000 服务器上您尝试安装 Microsoft SQL Server 2000 通过卷许可协议 (VLA) 媒体。 这样做, 收到以下错误信息CD KEY的 SQ
  • [新概念武器]气象战争 comsci
           气象战争的发动者必须是拥有发射深空航天器能力的国家或者组织....        原因如下:        地球上的气候变化和大气层中的云层涡旋场有密切的关系,而维持一个在大气层某个层次
  • oracle 中 rollup、cube、grouping 使用详解 daizj oraclegroupingrollupcube
    oracle 中 rollup、cube、grouping 使用详解 -- 使用oracle 样例表演示 转自namesliu -- 使用oracle 的样列库，演示 rollup, cube, grouping 的用法与使用场景    --- ROLLUP ， 为了理解分组的成员数量，我增加了 分组的计数  COUNT(SAL)   
  • 技术资料汇总分享 Dead_knight 技术资料汇总 分享
    本人汇总的技术资料，分享出来，希望对大家有用。 http://pan.baidu.com/s/1jGr56uE 资料主要包含： Workflow->工作流相关理论、框架(OSWorkflow、JBPM、Activiti、fireflow...) Security->java安全相关资料(SSL、SSO、SpringSecurity、Shiro、JAAS...) Ser
  • 初一下学期难记忆单词背诵第一课 dcj3sjt126com englishword
    could 能够 minute 分钟 Tuesday 星期二 February 二月 eighteenth 第十八 listen 听 careful 小心的，仔细的 short 短的 heavy 重的 empty 空的 certainly 当然 carry 携带；搬运 tape 磁带 basket 蓝子 bottle 瓶 juice 汁，果汁 head 头；头部
  • 截取视图的图片, 然后分享出去 dcj3sjt126com OSObjective-C
    OS 7 has a new method that allows you to draw a view hierarchy into the current graphics context. This can be used to get an UIImage very fast. I implemented a category method on UIView to get the vi
  • MySql重置密码 fanxiaolong MySql重置密码
    方法一:  在my.ini的[mysqld]字段加入： skip-grant-tables 重启mysql服务，这时的mysql不需要密码即可登录数据库  然后进入mysql mysql>use mysql;  mysql>更新 user set password=password('新密码') WHERE User='root'; mysq
  • Ehcache（03）——Ehcache中储存缓存的方式 234390216 ehcacheMemoryStoreDiskStore存储驱除策略
    Ehcache中储存缓存的方式   目录 1     堆内存（MemoryStore） 1.1     指定可用内存 1.2     驱除策略 1.3     元素过期 2   &nbs
  • spring mvc中的@propertysource jackyrong spring mvc
      在spring mvc中，在配置文件中的东西，可以在java代码中通过注解进行读取了： @PropertySource  在spring 3.1中开始引入 比如有配置文件 config.properties mongodb.url=1.2.3.4 mongodb.db=hello 则代码中   @PropertySource(&
  • 重学单例模式 lanqiu17 单例Singleton模式
    最近在重新学习设计模式，感觉对模式理解更加深刻。觉得有必要记下来。 第一个学的就是单例模式，单例模式估计是最好理解的模式了。它的作用就是防止外部创建实例，保证只有一个实例。 单例模式的常用实现方式有两种，就人们熟知的饱汉式与饥汉式，具体就不多说了。这里说下其他的实现方式 静态内部类方式: package test.pattern.singleton.statics; publ
  • .NET开源核心运行时，且行且珍惜 netcome java.net开源
    背景 2014年11月12日，ASP.NET之父、微软云计算与企业级产品工程部执行副总裁Scott Guthrie，在Connect全球开发者在线会议上宣布，微软将开源全部.NET核心运行时，并将.NET 扩展为可在 Linux 和 Mac OS 平台上运行。.NET核心运行时将基于MIT开源许可协议发布，其中将包括执行.NET代码所需的一切项目——CLR、JIT编译器、垃圾收集器（GC）和核心
  • 使用oscahe缓存技术减少与数据库的频繁交互 Everyday都不同 Web高并发oscahe缓存
    此前一直不知道缓存的具体实现，只知道是把数据存储在内存中，以便下次直接从内存中读取。对于缓存的使用也没有概念，觉得缓存技术是一个比较”神秘陌生“的领域。但最近要用到缓存技术，发现还是很有必要一探究竟的。   缓存技术使用背景：一般来说，对于web项目，如果我们要什么数据直接jdbc查库好了，但是在遇到高并发的情形下，不可能每一次都是去查数据库，因为这样在高并发的情形下显得不太合理——
  • Spring+Mybatis 手动控制事务 toknowme mybatis
    @Override    public boolean testDelete(String jobCode) throws Exception {       boolean flag = false;  &nbs
  • 菜鸟级的android程序员面试时候需要掌握的知识点 xp9802 android
    熟悉Android开发架构和API调用 掌握APP适应不同型号手机屏幕开发技巧 熟悉Android下的数据存储  熟练Android Debug Bridge Tool 熟练Eclipse/ADT及相关工具  熟悉Android框架原理及Activity生命周期 熟练进行Android UI布局 熟练使用SQLite数据库； 熟悉Android下网络通信机制，S
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他