dragdrop + 自定义事件

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 2 <html xmlns="http://www.w3.org/1999/xhtml">

 3 <head>

 4     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

 5     <title>dragdrop</title>

 6     <script type="text/javascript" src="eventutil.js"></script>

 7     <script type="text/javascript" src="prototypeevent.js"></script>

 8     <script type="text/javascript" src="dragdrop.js"></script>

 9 </head>

10 <body>

11     <div id="dragbox" class="draggable" style="width:100px;height:100px;background:#000000;position:absolute;"></div>

12     <div id="status"></div>

13 </body>

14 </html>

 

eventutil.js

 1 var EventUtil = {

 2     addHandler: function(element, type, handler) {

 3         if (element.addEventListener) {

 4             element.addEventListener(type, handler, false);

 5         } else if (element.attachEvent) {

 6             element.attachEvent("on" + type, handler);

 7         } else {

 8             element["on" + type] = handler;

 9         }

10     },

11     getEvent: function(event) {

12         return event ? event : window.event;

13     },

14     getTarget: function(event) {

15         return event.target || event.srcElement;

16     },

17     getRelatedTarget: function(event) {

18         if (event.relatedTarget) {

19             return event.relatedTarget;

20         } else if (event.toElement) {

21             return event.toElement;

22         } else if (event.fromElement) {

23             return event.fromElement;

24         } else {

25             return null;

26         }

27     },

28     getButton: function(event) {

29         if (document.implementation.hasFeature("MouseEvents", "2.0")) {

30             return event.button;

31         } else {

32             switch (event.button) {

33             case 0:

34             case 1:

35             case 3:

36             case 5:

37             case 7:

38                 return 0;

39             case 2:

40             case 6:

41                 return 2;

42             case 4:

43                 return 1;

44             }

45         }

46     },

47     getCharCode: function(event) {

48         if (typeof event.charCode == "number") {

49             return event.charCode;

50         } else {

51             return event.keyCode;

52         }

53     },

54     getWheelDelta: function(event) {

55         if (event.wheelDelta) {

56             return (client.engine.opera && client.engine.opera < 9.5 ? -event.wheelDelta : event.wheelDelta);

57         } else {

58             return -event.detail * 40;

59         }

60     },

61     getClipboardText: function(event) {

62         var clipboardData = (event.clipboardData || window.clipboardData);

63         return clipboardData.getData("text");

64     },

65     setClipboardText: function(event, value) {

66         if (event.clipboardData) {

67             return event.clipboardData.setData("text/plain", value);

68         } else if (window.clipboardData) {

69             return window.clipboardData.setData("text", value);

70         }

71     },

72     preventDefault: function(event) {

73         if (event.preventDefault) {

74             event.preventDefault();

75         } else {

76             event.returnValue = false;

77         }

78     },

79     removeHandler: function(element, type, handler) {

80         if (element.removeEventListener) {

81             element.removeEventListener(type, handler, false);

82         } else if (element.detachEvent) {

83             element.detachEvent("on" + type, handler);

84         } else {

85             element["on" + type] = null;

86         }

87     },

88     stopPropagation: function(event) {

89         if (event.stopPropagation) {

90             event.stopPropagation();

91         } else {

92             event.cancelBubble = true;

93         }

94     }

95 };

 

prototypeevent.js

 1 function EventTarget() {

 2     this.handlers = {};

 3 }

 4 EventTarget.prototype = {

 5     constructor: EventTarget,

 6     //注册

 7     addHandler: function(type, handler) {

 8         if (typeof this.handlers[type] == "undefined") {

 9             this.handlers[type] = [];

10         }

11         this.handlers[type].push(handler);

12     },

13     //触发

14     fire: function(event) {

15         if (!event.target) {

16             event.target = this;

17         }

18         if (this.handlers[event.type] instanceof Array) {

19             var handlers = this.handlers[event.type];

20             for (var i = 0, len = handlers.length; i < len; i++) {

21                 handlers[i](event);

22             }

23         }

24     },

25     //注销

26     removeHandler: function(type, handler) {

27         if (this.handlers[type] instanceof Array) {

28             var handlers = this.handlers[type];

29             for (var i = 0, len = handlers.length; i < len; i++) {

30                 if (handlers[i] === handler) {

31                     break;

32                 }

33             }

34             handlers.splice(i, 1);

35         }

36     }

37 };

 

dragdrop.js

 1 var DragDrop = function() {

 2 

 3         var dragdrop = new EventTarget();

 4         var dragging = null;

 5         var diffX = 0;

 6         var diffY = 0;

 7 

 8         function handleEvent(event) {

 9             //获取事件和目标

10             event = EventUtil.getEvent(event);

11             var target = EventUtil.getTarget(event);

12 

13             //确定事件类型

14             switch (event.type) {

15             case "mousedown":

16                 if (target.className.indexOf("draggable") > -1) {

17                     dragging = target;

18                     //鼠标在element内的坐标

19                     diffX = event.clientX - target.offsetLeft;

20                     /*

21                     console.log("鼠标在元素内的坐标: " + diffX);

22                     console.log("鼠标坐标: " + event.clientX);

23                     console.log("element坐标: " + target.offsetLeft);

24                     console.log("------------------------------");

25                     */

26                     diffY = event.clientY - target.offsetTop;

27                     dragdrop.fire({

28                         type: "dragstart",

29                         target: dragging,

30                         x: event.clientX,

31                         y: event.clientY

32                     });

33                 }

34                 break;

35 

36             case "mousemove":

37                 if (dragging !== null) {

38                     //获取事件

39                     event = EventUtil.getEvent(event);

40 

41                     //指定位置

42                     dragging.style.left = (event.clientX - diffX) + "px";

43                     dragging.style.top = (event.clientY - diffY) + "px";

44 

45                     //触发自定义事件

46                     dragdrop.fire({

47                         type: "drag",

48                         target: dragging,

49                         x: event.clientX,

50                         y: event.clientY

51                     });

52                 }

53                 break;

54 

55             case "mouseup":

56                 dragdrop.fire({

57                     type: "dragend",

58                     target: dragging,

59                     x: event.clientX,

60                     y: event.clientY

61                 });

62                 dragging = null;

63                 break;

64             }

65         };

66 

67         //公共接口

68         dragdrop.enable = function() {

69             EventUtil.addHandler(document, "mousedown", handleEvent);

70             EventUtil.addHandler(document, "mousemove", handleEvent);

71             EventUtil.addHandler(document, "mouseup", handleEvent);

72         };

73         dragdrop.disable = function() {

74             EventUtil.removeHandler(document, "mousedown", handleEvent);

75             EventUtil.removeHandler(document, "mousemove", handleEvent);

76             EventUtil.removeHandler(document, "mouseup", handleEvent);

77         };

78         return dragdrop;

79     }();

80 

81 DragDrop.addHandler("dragstart", function(event) {

82     var status = document.getElementById("status");

83     status.innerHTML = "Started dragging " + event.target.id;

84 });

85 

86 DragDrop.addHandler("drag", function(event) {

87     var status = document.getElementById("status");

88     status.innerHTML += " <br/> Dragged " + event.target.id + " to (" + event.x + "," + event.y + ")";

89 });

90 

91 DragDrop.addHandler("dragend", function(event) {

92     var status = document.getElementById("status");

93     status.innerHTML += "<br/> Dragged " + event.target.id + " at (" + event.x + "," + event.y + ")";

94 });

95 

96 DragDrop.enable();

你可能感兴趣的:(drag)

  • Nuxt Kit 自动导入功能：高效管理你的模块和组合式函数 qcidyu 好用的工具集合代码效率前端技巧Vue开发组合式函数模块管理自动导入NuxtKit
    title:NuxtKit自动导入功能：高效管理你的模块和组合式函数date:2024/9/14updated:2024/9/14author:cmdragonexcerpt:通过使用NuxtKit的自动导入功能，您可以更高效地管理和使用公共函数、组合式函数和VueAPI。无论是单个导入、目录导入还是从第三方模块导入，您都可以通过简单的API调用轻松实现。categories:前端开发tags:N
  • 【拖拽】自定义拖拽图标 风露_
    一、知识点设置被拖拽的元素draggable为true(HTML5新特性)关键方法：voiddataTransfer.setDragImage(img,xOffset,yOffset);注意点：Note:Ifthe[Element]isanexisting[HTMLElement],itneedstobevisibleintheviewportinordertobeshownasadragfeed
  • 【双语新闻】AGI安全与对齐，DeepMind近期工作 曲奇人工智能安全 agi安全llama人工智能
    我们想与AF社区分享我们最近的工作总结。以下是关于我们正在做什么，为什么会这么做以及我们认为它的意义所在的一些详细信息。我们希望这能帮助人们从我们的工作基础上继续发展，并了解他们的工作如何与我们相关联。byRohinShah,SebFarquhar,AncaDragan21stAug2024AIAlignmentForumWewantedtosharearecapofourrecentoutput
  • macos+vmware-fusion安装vmware-tools并使用 越甲的bode图 日常
    参考这个链接：https://www.cnblogs.com/dragon-aslan/p/7209857.html亲测完美运行
  • web页面自适应QWebEngineView的大小 吃面不喝汤66 前端
    #ifndefOPENVIPDIALOG_H#defineOPENVIPDIALOG_H#include#include"draggabledialog.h"#includenamespaceUi{classOpenVipDialog;}classOpenVipDialog:publicDraggableDialog{Q_OBJECTpublic:explicitOpenVipDialog(QWi
  • web前端 ios性能问题 zhenryx 前端
    1.禁止用户拖拽标签-webkit-user-drag:none;2.禁止用户选择标签user-select:none;//-webkit-touch-callout:none;///*系统默认菜单被禁用*/-webkit-user-select:none;/*webkit浏览器*/-khtml-user-select:none;/*早期浏览器*/-moz-user-select:none;/*火
  • 无边框窗口的移动和改变大小 梦想如此多娇 QTqt开发语言
    .hQStringgetImage();//无边框可改变大小boolisLeftPressDown;//判断左键是否按下QPointdragPosition;//窗口移动拖动时需要记住的点Directiondir;//窗口大小改变时，记录改变方向//无边框的界面鼠标移动事件QPointmousePoint;boolmouse_press=true;voidmouseMoveEvent(QMouse
  • 高通SA8295P芯片技术规格详解与原理解析 空间机器人 高通SA8295学习笔记专栏硬件工程自动驾驶汽车音视频
    高通SA8295P芯片技术规格详解与原理解析高通SA8295P（骁龙8295）是一款专为汽车座舱设计的高性能SoC（系统级芯片），采用最新的5nm工艺，具备强大的计算能力、图形处理能力以及丰富的外设支持。以下是该芯片的详细技术规格和工作原理解析。1.处理器核心（CPU）Snapdragon™SA8295PSIPQualcomm®Kryo™695CPU：基于Armv8Cortex技术，提供四个高性能
  • 语音识别 学习笔记2024 AI算法网奇 深度学习基础音视频人工智能
    目录dragonfly阿里达摩院FunASR：一款高效的端到端语音识别工具包不错的功能介绍librosa安装语音识别dragonfly阿里达摩院FunASR：一款高效的端到端语音识别工具包不错的功能介绍librosa，一个很有趣的Python库！-简书音频转特征向量GitHub-librosa/librosa:Pythonlibraryforaudioandmusicanalysislibrosa
  • 性能优化-高通cDSP（QDSP6）架构详解 发狂的小花 高性能开发基础教程#QCOMHexagoncDSP入门教程性能优化高通SoccDSPHVX
    本文主要介绍高通cDSP的架构，包括SnapDragon处理器介绍、cDSP整体架构，芯片架构，cDSP软件架构以及HVX介绍、最后介绍了HexagonSDK的环境配置和签名。个人简介：一个全栈工程师的升级之路！个人专栏：高性能（HPC）开发基础教程CSDN主页发狂的小花人生秘诀：学习的本质就是极致重复!目录一、前言1处理器二、QualcommSnapdragon1QualcommSnapdrag
  • PyQt5——QLineEdit（单行文本框控件） weixin_41881387 qt开发语言
    一、简介QLineEdit：单行文本框控件二、常用方法方法描述text()返回文本框的内容setText()设置文本框的内容setReadOnly()设置文本为只读setMaxLength()设置文本框所允许输入的最大字符数setDragEnable()设置文本框是否接受拖动setValidator()设置文本框的验证器（验证规则），将限制任意可能输入的文本，可用的校验器为QIntValidato
  • vue可拖拽移动放大缩小的弹框组件 dogface07 htmlcss3vue.jsjavascript前端
    完成一次拖放的事件过程是：dragstart–>dragenter–>dragover–>drop–>dragend下面是HTML5的拖拽事件dragstart：开始拖元素触发，作用于拖拽元素dragenter：元素拖进可drop元素（绑定drop事件的元素）时触发，作用于目标元素dragover：当元素拖动到drop元素上时触发，作用于目标元素drop：当元素放下到drop元素触发，作用于目标元
  • PyQt6 / PySide 6 实现可拖拽的多标签页 web 浏览器【1】（有 Bug） 阳子926 PythonPyQtPySidepythonpyqt
    声明：本项目代码来自以下两个项目PyQt5/PySide2实现QTabWidget的拖入拖出功能https://github.com/akihito-takeuchi/qt-draggable-tab-widgetSimPyWebX——使用PyQt5以及QWebEngineView构建网页浏览器Bug:存在很多问题：1.新拖拽的窗口无法新建标签页；2.旧窗口无法关闭；......代码：main.p
  • 《不凡名品世界名刀美图欣赏2020年2月6号更新》(一) 不凡名品
    KikuMatsuda松田菊男KikuKM-520SilverDragon(銀龍)全长:530MM刃长:330MM刃厚:8.3MM刃材:OU-31硬度:60-62HRC柄材:米卡塔附件:K鞘重量:980g产地:日本KikuMatsuda松田菊男松田菊男KM-170FUJIN雷神全长47.5CM刃长29.1CM刃厚1CM刃宽4.6CM材质OU-31硬度64HRC柄材Micarta（米卡塔）附件Kyd
  • 一篇文带你使用js实现拖拽排序 她说她一如既往的爱我 javascript开发语言ecmascript
    先介绍一下html5的drag属性,拖放（Drag和drop）是HTML5标准的组成部分。想要启用drag，只要给元素加上draggable="true"就行了（Safari5.1.2除外）。  实际效果：拖动事件(了解事件详情)  事件分为两类，当前拖动的元素上的事件，以及要放置的位置接收到的事件。  一.发生在拖动元素上的事件：事件名触发时机触发次数dragstart当拖动开始时触发一次1dr
  • vue3中用css transform实现组件自由拖拽 天天进步2015 前端开发css前端vue.js
    在Vue3中，可以使用CSStransform和mousedown、mousemove、mouseup事件来实现组件的自由拖拽。以下是一个简单的例子，展示如何使用这些技术来实现组件的自由拖拽。1.创建一个Vue3组件首先，创建一个Vue3组件（例如，Draggable.vue），并添加模板、样式和脚本。DragMeimport{ref,onMounted,onBeforeUnmount}from'
  • 【Unity优化】优化Android平台拖动地图表现 留待舞人归 unityandroid游戏引擎
    一、Android平台上拖动不平滑的现象团队使用的热更新框架还是比较老的ToLua，拖动地图的逻辑，实现的方案是，在地图上放置一个合适大小的Image组件作为RaycastTarget的对象，统一接受和处理跟地图拖动相关的逻辑。在C#层专门建立一个DragManager作为拖动事件管理器，其内部实现了IDragHandler，IPointerDownHandler，IPointerUpHandle
  • DragonFireFury lanyue456
    Alongtimeago,inapowerfulcountry,therewasakingwholovedmoneyverymuch.Hewantedatreasurewithalotofgemsinthemountainsbuthewasveryafraidofthetyrannosaurusthatguardedthetreasure.Sohecameupwithastrategy,hecal
  • VueDraggablePlus的学习与问题解决 揽昕 学习vue.js前端
    目录VueDraggablePlus的使用插件APIgroup属性拖拽分组delay响应时间disabled启用禁用scroll是否允许滚动animation过渡效果handle鼠标在指定元素上才允许拖动filter排除步允许拖动的元素chosenClass选中元素的样式ghostClass目标位置占位符的样式clone拷贝实现常用菜单功能dragClass拖拽项类名更多api事件函数move自定
  • Flutter 仿iOS桌面悬浮球效果 wahkim Flutter开发iosfluttercocoa
    Flutter仿iOS桌面悬浮球效果效果图可拖动的基础按钮自定义一个可动画展开关闭的路由使用->创建OverlayEntrydemo效果图RPReplay_Final1724998086可拖动的基础按钮classDraggableFloatingActionButtonextendsStatefulWidget{finalWidgetchild;finalSizechildSize;finalOf
  • vue实现组件拖拽 ズ少年瘾 vue.jsjavascript
    效果预览QQ录屏20231016140810组件drag.vueexportdefault{name:"Draggable",props:{list:{type:Array,default:()=>[],},config:{type:Object,default:()=>({name:"",push:true,pull:true,exchange:true,}),},},data(){return
  • 跟着大佬搬砖--- vue 组件拖拽缩放 Webgiserin JSvuevue.jsjavascript
    vue-drag-resize地址vue-draggable-resizable-gorkys地址案例案例学习汇总特有参考价值的GridLayout在线地址官网地址参考案例
  • 实现自定义拖动客服按钮 鹤鸣的日常 javascript前端开发语言
    import{ref}from'vue';exportdefault{setup(){consttop=ref(20);//初始位置的上边距constleft=ref(20);//初始位置的左边距letisDragging=false;lettouchStartX=0;lettouchStartY=0;conststartDrag=(event)=>{isDragging=true;constto
  • React实现组件的拖拽 赐你岁月如歌 React学习前端
    加粗样式近期接到了一个使antd的Drawer组件可以拖拽的需求，以前没有写过类似的案例，只能去网上搜索解决方案，发现有挺多react的拖拽的组件，但是项目中不允许随便引用组件，只能使用原生HTML的拖拽方案了。下面记录一下学习的心得：了解HTML的拖拽注意：为了让元素可拖动，需要使用HTML5draggable属性。提示：链接和图片默认是可拖动的，不需要draggable属性。在拖放的过程中会触
  • Cerebras DocChat发布：基于Llama 3构建，DocChat在几小时内完成GPT-4级别的对话问答训练 科技大本营 llama人工智能算法深度学习机器学习
    Cerebras发布的DocChat标志着基于文档的对话式问答系统的一个重大里程碑。Cerebras以其在机器学习（ML）和大型语言模型（LLMs）方面的深厚专业知识而闻名，推出了DocChat系列的两个新模型：CerebrasLlama3-DocChat和CerebrasDragon-DocChat。这些模型旨在提供高性能的对话式人工智能，特别是针对基于文档的问答任务，并利用Cerebras的尖
  • 后端使用Spring Boot框架 + 前端VUE 实现滑动模块验证码 八百码 前端html
    在现在常用的登录验证码方式有很多种，但是都不可避免被攻击，但是有很多方式可以防止被攻击，从而进行维护。现在我就讲解一下滑动块验证码的实现方式：这个是前端代码，我使用的是vue，在使用的时候注意：注意几个关键点：使用Vue的data函数来存储组件的状态，如isDragging、sliderPosition等。使用Vue的mounted生命周期钩子来获取容器和滑块的宽度。使用Vue的ref属性来方便地
  • 第二章 Reign of the Aegon 7 朱双伟_西潮坝上
    第二章ReignoftheAegon7-知乎《冰与火之歌前传火与血英文原版权力的游戏300年前的故事FireandBloodGameofThronesSongofIce乔治马丁[精装]GeorgeR.R.Martin[平装]GeorgeR.R.Martin》GeorgeR.R.Martin【摘要书评试读】图书OnceagainthekingunleashedhisdragonsagainstDor
  • (JS\VUE\REACT) div拖拽移动+控制大小（高度、宽度） 及 单独只控制div的宽度 丁先生320 javascriptcss3vuereact前端
    一、div拖拽移动+控制大小（高度、宽度）1.演示数据拖拽测试数据01测试数据022.初始化（页面生成时调用）varbox=document.getElementById('box')vardrag=document.getElementById('drag')varscale=document.getElementById('scale')//调用拖拽方法this.dragTop(drag)//
  • PySide学习笔记第十一章－PySide中的拖拽（放）操作 vseeker pythoncodePySideQTpythonmac
    在GUI编程中，拖拽操作即在不同的应用间拖拽对象以实现对象的移动1、简单的拖拽为了实现将行编辑器中的文本拖拽到按钮上，我们必须重写一些方法，所以我们在继承QtGui.QPushButton的基础上创造我们自己的BUTTON类#-*-coding:utf-8-*-"""ZetCodePySidetutorialThisisasimpledraganddropexample.author:JanBod
  • 泽平 的ScalersTalk第六轮新概念朗读持续力训练Day 82 20210613 郑泽平
    练习材料：Lesson81EscapeWhenhehadkilledtheguard,theprisonerofwarquicklydraggedhimintothebushes.Workingrapidlyinthedarkness,hesoonchangedintothedeadman'sclothes.Now,dressedinablueuniformandwitharifleoverhis
  • [星球大战]阿纳金的背叛 comsci
          本来杰迪圣殿的长老是不同意让阿纳金接受训练的.........     但是由于政治原因,长老会妥协了...这给邪恶的力量带来了机会     所以......现代的地球联邦接受了这个教训...绝对不让某些年轻人进入学院    
  • 看懂它，你就可以任性的玩耍了！ aijuans JavaScript
              javascript作为前端开发的标配技能，如果不掌握好它的三大特点：1.原型 2.作用域 3. 闭包 ,又怎么可以说你学好了这门语言呢？如果标配的技能都没有撑握好，怎么可以任性的玩耍呢？怎么验证自己学好了以上三个基本点呢，我找到一段不错的代码，稍加改动，如果能够读懂它，那么你就可以任性了。 function jClass(b
  • Java常用工具包 Jodd Kai_Ge javajodd
    Jodd 是一个开源的 Java 工具集， 包含一些实用的工具类和小型框架。简单，却很强大！ 写道 Jodd = Tools + IoC + MVC + DB + AOP + TX + JSON + HTML < 1.5 Mb Jodd 被分成众多模块，按需选择，其中 工具类模块有： jodd-core    &nb
  • SpringMvc下载 120153216 springMVC
    @RequestMapping(value = WebUrlConstant.DOWNLOAD) public void download(HttpServletRequest request,HttpServletResponse response,String fileName) { OutputStream os = null; InputStream is = null;
  • Python 标准异常总结 2002wmj python
    Python标准异常总结 AssertionError 断言语句（assert）失败 AttributeError 尝试访问未知的对象属性 EOFError 用户输入文件末尾标志EOF（Ctrl+d） FloatingPointError 浮点计算错误 GeneratorExit generator.close()方法被调用的时候 ImportError 导入模块失
  • SQL函数返回临时表结构的数据用于查询 357029540 SQL Server
    这两天在做一个查询的SQL，这个SQL的一个条件是通过游标实现另外两张表查询出一个多条数据，这些数据都是INT类型，然后用IN条件进行查询，并且查询这两张表需要通过外部传入参数才能查询出所需数据，于是想到了用SQL函数返回值，并且也这样做了，由于是返回多条数据，所以把查询出来的INT类型值都拼接为了字符串，这时就遇到问题了，在查询SQL中因为条件是INT值，SQL函数的CAST和CONVERST都
  • java 时间格式化 | 比较大小| 时区 个人笔记 7454103 javaeclipsetomcatcMyEclipse
    个人总结！ 不当之处多多包含！ 引用 1.0 如何设置 tomcat 的时区：          位置：(catalina.bat---JAVA_OPTS  下面加上)          set JAVA_OPT
  • 时间获取Clander的用法 adminjun Clander时间
    /**    * 得到几天前的时间    * @param d    * @param day    * @return    */   public static Date getDateBefore(Date d,int day){    Calend
  • JVM初探与设置 aijuans java
    JVM是Java Virtual Machine（Java虚拟机）的缩写，JVM是一种用于计算设备的规范，它是一个虚构出来的计算机，是通过在实际的计算机上仿真模拟各种计算机功能来实现的。Java虚拟机包括一套字节码指令集、一组寄存器、一个栈、一个垃圾回收堆和一个存储方法域。 JVM屏蔽了与具体操作系统平台相关的信息，使Java程序只需生成在Java虚拟机上运行的目标代码（字节码）,就可以在多种平台
  • SQL中ON和WHERE的区别 avords
    SQL中ON和WHERE的区别   数据库在通过连接两张或多张表来返回记录时，都会生成一张中间的临时表，然后再将这张临时表返回给用户。   www.2cto.com   在使用left jion时，on和where条件的区别如下：  1、 on条件是在生成临时表时使用的条件，它不管on中的条件是否为真，都会返回左边表中的记录。 
  • 说说自信 houxinyou 工作生活
    自信的来源分为两种,一种是源于实力,一种源于头脑.实力是一个综合的评定,有自身的能力,能利用的资源等.比如我想去月亮上,要身体素质过硬,还要有飞船等等一系列的东西.这些都属于实力的一部分.而头脑不同,只要你头脑够简单就可以了!同样要上月亮上,你想,我一跳,1米,我多跳几下,跳个几年,应该就到了!什么?你说我会往下掉?你笨呀你!找个东西踩一下不就行了吗?     无论工作还
  • WEBLOGIC事务超时设置 bijian1013 weblogicjta事务超时
            系统中统计数据，由于调用统计过程，执行时间超过了weblogic设置的时间，提示如下错误： 统计数据出错! 原因：The transaction is no longer active - status: 'Rolling Back. [Reason=weblogic.transaction.internal
  • 两年已过去，再看该如何快速融入新团队 bingyingao java互联网融入架构新团队
    偶得的空闲，翻到了两年前的帖子 该如何快速融入一个新团队，有所感触，就记下来，为下一个两年后的今天做参考。     时隔两年半之后的今天，再来看当初的这个博客，别有一番滋味。而我已经于今年三月份离开了当初所在的团队，加入另外的一个项目组，2011年的这篇博客之后的时光，我很好的融入了那个团队，而直到现在和同事们关系都特别好。大家在短短一年半的时间离一起经历了一
  • 【Spark七十七】Spark分析Nginx和Apache的access.log bit1129 apache
    Spark分析Nginx和Apache的access.log，第一个问题是要对Nginx和Apache的access.log文件进行按行解析，按行解析就的方法是正则表达式：   Nginx的access.log解析正则表达式   val PATTERN = """([^ ]*) ([^ ]*) ([^ ]*) (\\[.*\\]) (\&q
  • Erlang patch bookjovi erlang
    Totally five patchs committed to erlang otp, just small patchs. IMO, erlang really is a interesting programming language, I really like its concurrency feature. but the functional programming style
  • log4j日志路径中加入日期 bro_feng javalog4j
    要用log4j使用记录日志，日志路径有每日的日期，文件大小5M新增文件。 实现方式 log4j: <appender name="serviceLog" class="org.apache.log4j.RollingFileAppender"> <param name="Encoding" v
  • 读《研磨设计模式》-代码笔记-桥接模式 bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ /** * 个人觉得关于桥接模式的例子，蜡笔和毛笔这个例子是最贴切的：http://www.cnblogs.com/zhenyulu/articles/67016.html * 笔和颜色是可分离的，蜡笔把两者耦合在一起了：一支蜡笔只有一种
  • windows7下SVN和Eclipse插件安装 chenyu19891124 eclipse插件
    今天花了一天时间弄SVN和Eclipse插件的安装，今天弄好了。svn插件和Eclipse整合有两种方式，一种是直接下载插件包，二种是通过Eclipse在线更新。由于之前Eclipse版本和svn插件版本有差别，始终是没装上。最后在网上找到了适合的版本。所用的环境系统：windows7JDK：1.7svn插件包版本：1.8.16Eclipse：3.7.2工具下载地址：Eclipse下在地址：htt
  • [转帖]工作流引擎设计思路 comsci 设计模式工作应用服务器workflow企业应用
    作为国内的同行，我非常希望在流程设计方面和大家交流，刚发现篇好文(那么好的文章，现在才发现，可惜)，关于流程设计的一些原理，个人觉得本文站得高，看得远，比俺的文章有深度，转载如下 ================================================================================= 自开博以来不断有朋友来探讨工作流引擎该如何
  • Linux 查看内存，CPU及硬盘大小的方法 daizj linuxcpu内存硬盘大小
    一、查看CPU信息的命令 [root@R4 ~]# cat /proc/cpuinfo |grep "model name" && cat /proc/cpuinfo |grep "physical id" model name : Intel(R) Xeon(R) CPU X5450 @ 3.00GHz model name :
  • linux 踢出在线用户 dongwei_6688 linux
    两个步骤： 1.用w命令找到要踢出的用户，比如下面：   [root@localhost ~]# w 18:16:55 up 39 days, 8:27, 3 users, load average: 0.03, 0.03, 0.00 USER TTY FROM LOGIN@ IDLE JCPU PCPU WHAT
  • 放手吧,就像不曾拥有过一样 dcj3sjt126com
    内容提要： 静悠悠编著的《放手吧就像不曾拥有过一样》集结“全球华语世界最舒缓心灵”的精华故事，触碰生命最深层次的感动，献给全世界亿万读者。《放手吧就像不曾拥有过一样》的作者衷心地祝愿每一位读者都给自己一个重新出发的理由，将那些令你痛苦的、扛起的、背负的，一并都放下吧！把憔悴的面容换做一种清淡的微笑，把沉重的步伐调节成春天五线谱上的音符，让自己踏着轻快的节奏，在人生的海面上悠然漂荡，享受宁静与
  • php二进制安全的含义 dcj3sjt126com PHP
    PHP里，有string的概念。 string里，每个字符的大小为byte（与PHP相比，Java的每个字符为Character，是UTF8字符，C语言的每个字符可以在编译时选择）。 byte里，有ASCII代码的字符，例如ABC，123，abc，也有一些特殊字符，例如回车，退格之类的。 特殊字符很多是不能显示的。或者说，他们的显示方式没有标准，例如编码65到哪儿都是字母A，编码97到哪儿都是字符
  • Linux下禁用T440s，X240的一体化触摸板(touchpad) gashero linuxThinkPad触摸板
    自打1月买了Thinkpad T440s就一直很火大，其中最让人恼火的莫过于触摸板。   Thinkpad的经典就包括用了小红点(TrackPoint)。但是小红点只能定位，还是需要鼠标的左右键的。但是自打T440s等开始启用了一体化触摸板，不再有实体的按键了。问题是要是好用也行。   实际使用中，触摸板一堆问题，比如定位有抖动，以及按键时会有飘逸。这就导致了单击经常就
  • graph_dfs hcx2013 Graph
    package edu.xidian.graph; class MyStack { private final int SIZE = 20; private int[] st; private int top; public MyStack() { st = new int[SIZE]; top = -1; } public void push(i
  • Spring4.1新特性——Spring核心部分及其他 jinnianshilongnian spring 4.1
    目录 Spring4.1新特性——综述 Spring4.1新特性——Spring核心部分及其他 Spring4.1新特性——Spring缓存框架增强 Spring4.1新特性——异步调用和事件机制的异常处理 Spring4.1新特性——数据库集成测试脚本初始化 Spring4.1新特性——Spring MVC增强 Spring4.1新特性——页面自动化测试框架Spring MVC T
  • 配置HiveServer2的安全策略之自定义用户名密码验证 liyonghui160com
        具体从网上看   http://doc.mapr.com/display/MapR/Using+HiveServer2#UsingHiveServer2-ConfiguringCustomAuthentication   LDAP Authentication using OpenLDAP Setting
  • 一位30多的程序员生涯经验总结 pda158 编程工作生活咨询
    1.客户在接触到产品之后，才会真正明白自己的需求。 　　这是我在我的第一份工作上面学来的。只有当我们给客户展示产品的时候，他们才会意识到哪些是必须的。给出一个功能性原型设计远远比一张长长的文字表格要好。 2.只要有充足的时间，所有安全防御系统都将失败。 　　安全防御现如今是全世界都在关注的大课题、大挑战。我们必须时时刻刻积极完善它，因为黑客只要有一次成功，就可以彻底打败你。   3.
  • 分布式web服务架构的演变 自由的奴隶 linuxWeb应用服务器互联网
    最开始，由于某些想法，于是在互联网上搭建了一个网站，这个时候甚至有可能主机都是租借的，但由于这篇文章我们只关注架构的演变历程，因此就假设这个时候已经是托管了一台主机，并且有一定的带宽了，这个时候由于网站具备了一定的特色，吸引了部分人访问，逐渐你发现系统的压力越来越高，响应速度越来越慢，而这个时候比较明显的是数据库和应用互相影响，应用出问题了，数据库也很容易出现问题，而数据库出问题的时候，应用也容易
  • 初探Druid连接池之二——慢SQL日志记录 xingsan_zhang 日志连接池druid慢SQL
    由于工作原因，这里先不说连接数据库部分的配置，后面会补上，直接进入慢SQL日志记录。   1.applicationContext.xml中增加如下配置： <bean abstract="true" id="mysql_database" class="com.alibaba.druid.pool.DruidDataSourc
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他