简明编程
简明编程

前端系列——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)

  • 今日读书笔记分享 小朗_18f9
    1.如果我们通过批评来提出主张，人们的反应常常是申辩或反击。反之，如果我们直接说出需要，其他人就较有可能做出积极的回应。2.如果我们不看重自己的需要，别人可能也不会。实际上，如果直接说出需要，获得积极回应的可能性就会增加。3.真诚待人比委曲求全更为可贵。如果别人感到不安，我们可以认真地倾听，但无须责备自己。4.我们意识到，虽然我们对自己的意愿、感受和行动负有完全的责任，但无法为他人负责。我们还发现
  • Nginx 如何解决单页应用 History 模式路由的 404 难题？ wsj__WSJ nginx
    在现代前端开发中，单页应用（SPA）已经成为主流架构。无论是React、Vue还是Angular，都广泛使用History模式路由来实现无刷新页面跳转。但这个看似流畅的体验背后，却隐藏着一个容易被忽视的服务器配置问题——当用户直接访问路由地址或刷新页面时，往往会出现404错误。今天我们就来聊聊Nginx是如何通过简单配置解决这个问题的。一、History模式路由的“陷阱”先来看一个常见场景：当我们
  • 任涵去脂——秋雨寒了红叶 任涵去脂
    粉蝶尖尖，蜓青风淡。笔锋里流出唐诗宋词，行间中藏匿了十里桃花。淡雅几笔，远寄一束听雨的轻盈。幽长月光下，肩落长影，飘逸着风幔罗幛的秋香。任涵去脂，原文地址http://www.rhqz8.cn/rhqz.html秋雨寒了红叶。捧起一缕秋风，听红叶细语。是秋的辉煌，是冬的序言。在秋色冬雪间连着相依相伴的岁月。秋是冬的情，冬是秋的梦。山岭红秀，细雨如绸。撑起一伞秋雨，流淌着海洋的斑驳。回眸中，一川朦胧
  • 网络安全第三次作业搭建前端页面并解析
    我制作的是一个简单的登录页面网源代码1.CSS中box-sizing:border-box：使元素宽度包含边框和内边距，避免布局因padding变化错位。2.min-height:100vh：让body高度至少等于屏幕高度，确保登录框始终居中，不受内容高度影响。3..login-container的max-width:400px：限制登录框最大宽度，在大屏设备上不无限拉伸，保持美观。4.input
  • ikun-ui v0.2.7版本发布：组件功能增强与体验优化 时琦旖
    ikun-uiv0.2.7版本发布：组件功能增强与体验优化ikun-ui是一个基于Svelte框架构建的现代化UI组件库，专注于为开发者提供高质量、易用的前端组件。在最新发布的v0.2.7版本中，团队对多个核心组件进行了功能增强和体验优化，特别是在交互体验和视觉表现方面有了显著提升。组件功能增强工具提示与弹出框组件优化工具提示(Tooltip)和弹出框(Popover)组件新增了两项实用的交互控制
  • JavaScript 基础语法与核心概念实战：从变量到定时器 Elieal javascript开发语言ecmascript
    JavaScript作为前端开发的核心语言，其基础语法和数据类型是入门的关键。本文将通过实际代码示例，详解JavaScript的变量、数据类型、复合类型及常用交互功能，帮助初学者快速掌握核心概念。一、变量与基本数据类型变量是存储数据的容器，JavaScript中通过var（ES5）、let/const（ES6）声明。基本数据类型是构建复杂程序的基础，包括以下5种：//基本数据类型示例vara=10
  • javascript基本内容和标签 Sonnenblume_f IT总结编程语言javascriptIT总结
    js概念:javascript是互联网上最流行的，可以嵌套到html代码中的，一种基于对象和事件驱动的，并具有安全性能的脚本语言。具有1）向html页面中增加交互行为；2）脚本语言，语法和java类似；3）解释性语言，边执行边解释;4）跨平台，每个浏览器都具有js解释器;作用：增删HTML和css中的代码,能够动态校验数据组成：ECMAScript（核心）BOM浏览器对象模型DOM文档对象模型引入
  • 【前端】ikun-qrcode：极简的二维码生成组件，使用view而非canvas避免层级问题 青春狗头少年不会梦到格温学姐 前端
    文章目录背景ikun-qrcode界面效果如何发布一款自己的插件到uniapp市场。（5分钟搞定）背景之前在uniapp上100行搞定二维码生成，现在封装为vue组件分享出来：下载地址：https://ext.dcloud.net.cn/plugin?id=19351ikun-qrcode使用基础的view渲染二维码，需要给定宽高和单位和数据：uniapp默认整体宽度是750rpx。界面效果如何发
  • 【前端】ikun-pptx编辑器前瞻问题二： pptx的压缩包结构，以及xml正文树及对应元素介绍
    文章目录PPTX文件本质：一个压缩包核心文件解析1.幻灯片内容文件(ppt/slides/slideX.xml)2.元素类型解析文本框元素(p:sp)图片元素(p:pic)单位系统开发注意事项参考工具pptx渲染路线图PPTX文件本质：一个压缩包PPTX文件实际上是一个遵循OpenXML标准的ZIP压缩包，包含多个XML文件和其他资源。我们可以通过解压工具查看其内部结构：pptx文件├──[Con
  • Vue3 实现 DOCX 文档在线预览功能（基于 docx-preview）
    Vue3实现DOCX文档在线预览功能（基于docx-preview）在本篇文章中，我们将介绍如何使用Vue3+docx-preview来实现浏览器端的.docx文档预览功能。项目依赖首先需要安装以下依赖：npminstalldocx-previewaxios组件代码详解Template部分预览DOCX按钮用于触发加载文档事件，文档内容将渲染在docxContainer容器中。Script部分imp
  • PHP与Web页面交互：从基础表单到AJAX实战 独立开发者阿乐 综合性原创前端php交互Web页面表单处理AJAX技术AJAX
    文章目录PHP与Web页面交互：从基础到高级实践1.引言2.基础表单处理2.1HTML表单与PHP交互基础2.2GET与POST方法比较3.高级交互技术3.1AJAX与PHP交互3.2使用FetchAPI进行现代AJAX交互4.文件上传处理5.安全性考量5.1常见安全威胁与防护5.2数据验证与过滤6.现代PHP与前端框架交互6.1构建RESTfulAPI6.2使用JWT进行认证7.性能优化7.1缓
  • gpt面试题 任小栗 #面试题gptvue.js前端
    vue面试题一、响应式系统相关❓1.Vue3的响应式系统是如何实现的？和Vue2有何本质区别？答案：Vue3使用Proxy实现响应式（位于@vue/reactivity模块），替代Vue2的Object.defineProperty。核心机制如下：使用targetMap:WeakMap存储依赖关系利用track()和trigger()方法实现依赖收集与派发更新effect()包装副作用函数，自动收
  • 2015笔记——富文本 满庭花醉三千客
    鉴于之前遇到富文本的东西，一窍不通，如今是要好好学习学习了，先从最基本的开始吧：屏幕快照2015-12-1016.28.40.png我分别设置了字号、字体颜色、下划线、字体及大小、删除线。接下来给label赋值：屏幕快照2015-12-1016.29.09.png为了直观，我给label添加了背景色。接下来就是看效果了：屏幕快照2015-12-1016.33.43.png是不是很简单呢？加油！
  • 《恋恋笔记本》:不仅仅是爱之絮语 平生灯火
    琼瑶式的浪漫爱情童话，加上好莱坞经典的编织手段，成就了无数影迷津津乐道的一部纯爱经典。象我这个年纪，为此感动和沉醉似乎已不太可能，但竟然也会有一些或柔软或稀奇古怪的感慨。演变中的爱情主题词。季节有寒来暑往，人生有红颜白发。一路走过爱情的旅途，每一程都有不同的风景，不同的感受。年轻的时候，爱是青春不顾一切的燃烧。就像艾丽和诺亚的十七岁一样，每个人也许都曾有那么一个夏天，爱情将青春燃烧得肆无忌惮，燃烧
  • 2024年十大返利app排行榜,全网佣金超高的返利平台推荐十款 直返APP淘宝优惠券
    随着电子商务的快速发展和互联网消费的普及，越来越多的人开始关注返利软件。返利软件作为一种便捷的消费理财方式，不仅可以让用户在购物时享受到优惠折扣，还能通过返利机制获得额外的佣金。在这篇文章中，我们将为大家介绍返利软件十大排行榜以及返利佣金最高的APP。月入十万必看！都在挣钱！推荐几个月入几千到几万的靠谱副业项目！（公众号：善士思维笔记）一、直返直返的口号是“返利就用直返”，它强调没有上级赚差价，直
  • 网络爬虫进阶 rooney2024 爬虫
    目录一、进阶爬虫的核心挑战二、关键技术与最佳实践三、实战案例：爬取动态电商价格（伪代码示例）四、持续学习路径结语一、进阶爬虫的核心挑战动态渲染页面(JavaScript/AJAX)问题：数据由JavaScript动态加载生成，初始HTML中不存在。解决方案：浏览器自动化工具：Selenium,Playwright,Puppeteer。模拟真实浏览器行为，等待JS执行并渲染出完整DOM后再解析。无头
  • 读书笔记 kissmoonmiss
    读《有钱人为何用长钱包》读了整本书，如果让我用一句话总计，那么我觉得最合适的话就是：你善待钱，钱善待你。而对于现今的我们来说，可能越来越少的人出门还带着钱包，表面上整本书的观点和建议也许不太用的上，但是我想，其实作者希望我们知道的是，我们应该控制好自己的金钱流向，每一笔钱都花在刀刃上，而不是随意花钱从不记账（这里我就想到自己，上大学以来，虽然每个月父母会给一定的生活费，但是从来都是入不敷出，自己从
  • OpenHarmony外设驱动移植指南 你我皆是牛马星人 鸿蒙开发HarmonyOSOpenHarmonyharmonyosOpenHarmony鸿蒙开发源码分析迁移学习嵌入式硬件驱动开发
    往期推文全新看点（文中附带最新·鸿蒙全栈学习笔记）鸿蒙（HarmonyOS）北向开发知识点记录~鸿蒙（OpenHarmony）南向开发保姆级知识点汇总~鸿蒙应用开发与鸿蒙系统开发哪个更有前景？嵌入式开发适不适合做鸿蒙南向开发？看完这篇你就了解了~对于大前端开发来说，转鸿蒙开发究竟是福还是祸？鸿蒙岗位需求突增！移动端、PC端、IoT到底该怎么选？记录一场鸿蒙开发岗位面试经历~持续更新中……外设驱动子
  • 【OpenHarmony】鸿蒙开发：轻量系统服务管理|存储机制详解(一) 你我皆是牛马星人 HarmonyOS鸿蒙开发OpenHarmonyharmonyos鸿蒙开发OpenHarmony嵌入式硬件SAStore模块物联网
    往期推文全新看点（文中附带最新·鸿蒙全栈学习笔记）鸿蒙（HarmonyOS）北向开发知识点记录~鸿蒙（OpenHarmony）南向开发保姆级知识点汇总~鸿蒙应用开发与鸿蒙系统开发哪个更有前景？嵌入式开发适不适合做鸿蒙南向开发？看完这篇你就了解了~对于大前端开发来说，转鸿蒙开发究竟是福还是祸？鸿蒙岗位需求突增！移动端、PC端、IoT到底该怎么选？记录一场鸿蒙开发岗位面试经历~持续更新中……一、前言本
  • 平平淡淡，简简单单 HH_木又寸
    你可以幼稚，可以内向，可以女汉子，可以玛丽苏，可以洒脱，可以浪漫，你的存在本身就是一件很美好的事。你的独一无二没人可以代替！看到自己睡觉（打瞌睡）做出的笔记还是挺可爱的，莫名笑出声来哈哈哈哈我总是习惯性的原谅别人，我后悔了好多人，我遇到的很好的人。
  • Android音视频探索之旅 | Webrtc 1对1音视频通话核心流程分析 慢行的骑兵 音视频android音视频webrtc
    一.前言使用Webrtc实现1对1的音视频通话，先从Web端进行学习要比直接从Android端进行学习要轻松许多（若没有JS和Html以及Node基础，查找相关基础教程，能梳理代码的逻辑即可）。本文Android端接入Webrtc是通过引入官方的sdk来实现的。本文涉及到的Demo代码包含三部分，服务器端、Web端、Android端。服务器端使用的是Node，Web使用的是Html和JS，Andr
  • Leetcode刷题笔记——哈希表篇 code_lover_forever Leetcode刷题笔记leetcode笔记散列表python
    Leetcode刷题笔记——哈希表篇一、哈希表在面试中的高频考题第一题：两数之和Leetcode1:两数之和：中等题（详情点击链接见原题）给定一个整数数组nums和一个整数目标值target，请你在该数组中找出和为目标值target的那两个整数，并返回它们的数组下标python代码解法classSolution:deftwoSum(self,nums:List[int],target:int)->
  • 20200526读书笔记 龙套哥萨克海龙
    阅读1小时，总计1247小时，第1192日阅读《长安与河北之间》第7章通过对魏博的个案研究，探讨在安史乱后一直以兵雄天下著称的河朔三镇为何未能在唐末五代的历史巨变中继续扮演主要角色。魏博是安史乱后唐廷为招抚安史降将所置的河朔三镇之一。之后经代宗、德宗、宪宗等朝，虽屡经叛顺，不过自穆宗以后，魏博与唐廷之间基本形成了以共同承认“河朔故事”为基础的稳定关系。这一中唐以来形成的奉唐天子为正朔，各个藩镇依据
  • vue3 + xlsx + file-saver 读取excel数 土豆丶杨 前端javascriptvue.js
    导出{{index}}import{ref}from"vue";import*asXLSXfrom"xlsx";importExport2Excelfrom'@/utils/Export2Excel'exportdefault{setup(){constexcelData=ref([]);constindex=ref("");constresData=ref([])consttitle=ref([
  • 《唤醒老虎——启动自我疗愈本能。全书读书总结（君子成人之美——成成） 大道之心
    经过20多天的阅读。终于把《唤醒老虎启动自我疗愈本能》这本书读完了。昨天晚上举行了结营典礼。只是网络结营典礼，但我还是觉得有很重的仪式感。让人意外的是，我和我的搭档居然还获得了将金50元，实在是意外之喜。回顾这20多天的历程。从开始的认真看书，认真写读书笔记。到后来的有些懒散，敷衍。其实我自己都为自己捏了把汗。中间出了一个状况，就是我居然读着读着，把书给弄丢了。全靠着电子书和喜马拉雅听书啃完了中间
  • Python 服务器端与客户端的加密通信（SSL/TLS）解析 现实逃脱计划TA pythonssl网络
    ```htmlPython服务器端与客户端的加密通信（SSL/TLS）解析在当今互联网时代，数据安全变得越来越重要。为了保护数据在传输过程中的安全，使用SSL/TLS协议进行加密通信成为了一种常见的做法。本文将详细介绍如何在Python中实现服务器端和客户端之间的SSL/TLS加密通信。什么是SSL/TLS？SSL（SecureSocketsLayer）和TLS（TransportLayerSec
  • 【学术会议投稿】Vue.js组件开发实战：从零构建高效可复用组件 小周不想卷 艾思科蓝学术会议投稿vue.js
    【IEEE出版|会后3-4个月EI检索】第三届云计算、大数据应用与软件工程国际学术会议(CBASE2024）_艾思科蓝_学术一站式服务平台更多学术会议请看：https://ais.cn/u/nuyAF3目录引言一、Vue.js组件开发基础二、构建高效可复用组件三、Vue.js组件的高级特性四、Vue.js的优点与缺点Vue.js的优点Vue.js的缺点引言在现代前端开发中，Vue.js凭借其简洁的
  • 在vue项目中使用富文本编辑器 - tinymce 橘式不妙 vue富文本编辑器vue.js前端javascript编辑器
    推荐文章tinymce常用配置摘要在vue项目中使用tinymce富文本编辑器。这款编辑器比较轻量级、界面简洁、功能丰富，主要是易扩展。使用步骤安装tinymce官方地址1.安装tinymce#pnpm命令是npm命令的增强，p是proformance的意思，高性能pnpminstall--save"@tinymce/tinymce-vue@^5"2.引入tinymce的mainjstinymce
  • vue2解决页面重排滚动条问题 啥都不是的小白菜 前端javascripthtml
    项目场景：项目场景：vue2问题描述例如：在一个卡片页面底部添加一条数据后，滚动条自动跑到了页面顶部去了：原因分析：可能是添加数据后页面重排导致的解决方案：提示：通过deepseek给出了一个较为高效的方案且不会干扰用户的正常滚动行为exportdefault{data(){return{scrollPosition:0};},beforeUpdate(){this.scrollPosition=
  • 2019-09-12郑渊洁家庭教育课-读书笔记 szli2019
    家庭教育不是管理。是示范和引导。父母觉得孩子不行，实际上是爸妈自己不行。如果没有合格的父母，你的孩子是不可能优秀的。家庭教育比学校教育重要，家庭教育能决定孩子的一生。孩子有三个很突出的特点：1、模仿能力强；2、逆反心理强；3、想象力丰富。想要孩子做到任何事情，你先做给他看，你不用说话。教育孩子最忌讳的就是用嘴。闭上你的嘴，抬起你的腿，走你的人生路，演示给孩子看。身教非常重要。你发现孩子有什么问题，
  • 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其他