jquery ui draggable限制拖动区域

评论(0)浏览(562)分类:JavaScript/Ajax开发技巧
jquery ui draggable限制拖动区域  jquery ui draggable如何限制被拖动对象的位置区域,不允许在指定区域内容放置被拖动的对象,如果在禁止区域内容放置对象则还原被拖动对象位置,效果如下。  jquery ui draggable限制拖动区域源代码如下!doctype htmlhtml lang=enheadmeta charset=utf-8titlejquery ui draggable限制拖动区域/titlelink rel=stylesheet href=http://code...

Jstorage类库本地存储数据

评论(0)浏览(480)分类:JavaScript/Ajax开发技巧
Jstorage类库本地存储数据  jStorage使用 HTML5localstorage 作为存储容器或者不支持local storage时(IE7-)则使用 userDatabehavior 作为存储容器。  对于IE浏览器,存储的数据位置为userData  在XP下,一般位于C:\DocumentsandSettings\用户名\UserData,有些时候会在C: \DocumentsandSettings\用户名\ApplicationData\Microsoft\InternetExplorer \UserData。 ..

jquery仿淘宝规格颜色选择效果

评论(0)浏览(2951)分类:JavaScript/Ajax开发技巧
jquery仿淘宝规格颜色选择效果2016-8-9:新增剩余数量。  jquery实现的仿淘宝规格颜色选择效果源代码如下script type=text/javascript src=http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js/scriptstyledd,dl{zoom:1;overflow:hidden}dt,li{float:left;list-style:none;margin-left:10px;line-height:50px}dt a,li a{display:block;text-align:center;border:so..

javascript获取星座代码

评论(0)浏览(273)分类:JavaScript/Ajax开发技巧
javascript获取星座代码  javascript获取星座源代码script //javascript获取星座函数 //@month:月份,注意从1开始。日期对象是从0开始 //@date:日期 function getStar(month, date) { var star = { 魔羯座: [[12, 22], [1, 19]], 水瓶座: [[1, 20], [2, 18]], 双鱼座: [[2, 19], [3, 20]], 白羊座: [[3, 21], [4, 19]], 金..

my97计算2个时间差

评论(0)浏览(419)分类:JavaScript/Ajax开发技巧
my97计算2个时间差  my97日历如何计算2个时间差,实现方法就是2个my97都配置onpicked,判断都选择值后转为日期对象相减下就得到相差的毫秒了,再转为单位。  my97日历如何计算2个时间差源代码如如下script language=javascript type=text/javascript src=/demo/my97/WdatePicker.js/scriptscript function compute() { var d1 = document.getElemen..

js读取设置cookie示例

评论(0)浏览(204)分类:JavaScript/Ajax开发技巧
js读取设置cookie示例titlejs读取设置cookie示例/titlescript //js设置cookie函数 //@name:cookie名称,不可省略 //@value:cookie值,不可省略 //@day:有效期,单位天。如果不设置则为内存cookie function setCookie(name, value, day) { var d = day == undefined ? null : new Date(); if (d) d.setDate(d.getDate() + day); ..

ligerui tree如何获取全路径,包含父节点

评论(0)浏览(524)分类:JavaScript/Ajax开发技巧
ligerui tree如何获取全路径,包含父节点  ligerui的tree控件,如何获取全路径,选择子节点后,父节点没有被勾选也一起获取,效果如下  ligerui tree如何获取全路径,包含父节点源代码如下。版本为V1.2.5,其他版本自己对照api和生成的树结构修改对应的方法名称和jquery选择器。示例居于ligerui\V1.2.5\Source\demos\tree\treedata.htm进行修改。!DOCTYPE html PUBLIC -//W3C//DTD ..

for循环遍历如何延时执行

评论(0)浏览(1543)分类:JavaScript/Ajax开发技巧
for循环遍历如何延时执行  如要遍历一个数组,for语句要如何延时输出数组中的项目,一般情况下想当然都会这样写div id=dv/divscript var arr = [1, 2, 3, 4, 5]; for (var i = 0; i arr.length; i++) { setTimeout(function () { document.getElementById('dv').innerHTML += arr[i] + 'br'; }, 3000); }/script ..

JSONP跨域访问在线代理API

评论(0)浏览(2720)分类:JavaScript/Ajax开发技巧
JSONP跨域访问在线代理APIajax请求不同域名的页面时,由于浏览器安全限制是不允许请求的,发生错误。此时需要搭建服务器做代理捉取跨域页面,ajax请求自己建立的代理页面。如果你不想建立自己的代理服务,因为有时我根本就没打算涉及服务端任何代码,但是讨厌的浏览器的同源策略,阻止了我们的ajax调用。比如我想访问一个天气的restfull api,如果我直接去GET: $.get(ht..

网站添加谷歌翻译工具条后自动翻译为指定语言

评论(0)浏览(855)分类:JavaScript/Ajax开发技巧
网站添加谷歌翻译工具条后自动翻译为指定语言  如何给网站添加谷歌工具条可以参考这篇文章:给网站增加google翻译工具条  现在要实现的是,如何通过谷歌翻译工具条,自动将网站的内容翻译为指定的语言,不需要人工点开语言选择框,然后选择对应的语言后才执行翻译操作。  通过观察谷歌翻译工具条可以看到语言选择DOM对象在一个iframe里面,样式为.goog-te-menu-frame,还在不是从谷歌..

js给选择文字添加链接

评论(0)浏览(336)分类:JavaScript/Ajax开发技巧
js给选择文字添加链接  js如何给选中的文字添加链接,就是选中的文字用a对象包裹起来。script function surroundContent() { var r; if (document.selection) { r = document.selection.createRange(); if (r.text != '') r.pasteHTML('a href=#' + r.text + '/a') } else if (wind..

javascript计算器

评论(0)浏览(371)分类:JavaScript/Ajax开发技巧
javascript计算器  JavaScript实现的简单计算器功能,界面如下  javascript计算器源代码如下script type=text/javascript src=http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js/scriptstyle #calc{padding:10px;background:#f1f1f1;width:201px} #display{border:solid 1px #ccc;margin-bottom:5px;padding:5px} #up,#down{height:20px;..

JavaScript canvas时钟

评论(0)浏览(181)分类:JavaScript/Ajax开发技巧
JavaScript canvas时钟  使用html5 canvas对象绘制的时钟,O(_)O哈哈~。。简陋了点。。  JavaScript canvas时钟源代码如下script type=text/javascript src=http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js/scriptstylebody {margin: 0; padding: 0;}/styletitlecanvas时钟/titlecanvas id=c/canvasscriptvar a = 1;$(function () { var c = docum..

JavaScript五子棋盘

评论(0)浏览(403)分类:JavaScript/Ajax开发技巧
JavaScript五子棋盘  javascript实现的五子棋盘,可以自定义棋盘大小,效果如下  注意:判断输赢的算法没有写,要用自己扩展。IE8-不支持border-radius样式,所以无法显示圆形的,需要用圆形背景图片模拟,这个没做兼容,所以会显示为正方形的旗子。  JavaScript五子棋盘源代码如下!doctype htmltitleJavaScript五子棋盘/titlestyle .board{position:rela..

input输入内容后使用×号一键删除

评论(0)浏览(402)分类:JavaScript/Ajax开发技巧
input输入内容后使用×号一键删除  如何实现input输入框输入内容后,再输入框最右边出现一个号,点击叉号删除当前input输入框的内容,效果如下  input输入内容后使用号一键删除源代码如下,已经做成jQuery插件形式!doctype htmlstyle div.clearText{display:inline-block;position:relative} div.clearText input{border:solid 1px #666;height:20px;line-height:20px..

+/-一元运算符计算空字符结果为0分析

评论(0)浏览(326)分类:JavaScript/Ajax开发技巧
+/-一元运算符计算空字符结果为0分析  JavaScript一元运算符对空字符计算时为什么得到0,代码如下scriptalert(+'')//0alert(+[])//0/script  这是因为对空字符使用一元运算符+/-时,空字符会被强制转为0或者将字符串传入Number构造函数中,而Number('')返回0。scriptalert(Number(''))//0/script  +[]为什么也是0,是应为+和对象运算,会调用对象的t..

js判断已经滚动到页面底部

评论(0)浏览(370)分类:JavaScript/Ajax开发技巧
js判断已经滚动到页面底部  js如何判断页面已经滚动到底部!DOCTYPE htmlhtmlhead meta charset=UTF-8 titlejs判断已经滚动到页面底部/title/headbody style=margin:0;padding:0 div id=dvBT style=position:fixed;bottom:0;right:0;background:#fff/div div id=part1 style=height:2000px;overflow: auto;background: lightblue; /div div id=part2 ..

jQuery.tablesorter 2.0中文排序解决办法

评论(0)浏览(440)分类:JavaScript/Ajax开发技巧
jQuery.tablesorter 2.0中文排序解决办法  jQuery.tablesorter 2.0中文排序解决办法,jQuery.tablesorter 2.0中文排序使用的sortText方法,使用js操作符号进行对比,操作符号对中文无效,导致排序出问题。需要更改为localeCompare。jQuery.tablesorter 2.0新增了textSorter配置,改写内部的文字排序,可以增加此配置而不需要更改jQuery.tablesorter 2.0源代码。jQuery.tablesorter未配..

js简易数字微调调整示例

评论(0)浏览(219)分类:JavaScript/Ajax开发技巧
js简易数字微调调整示例  js实现数字微调示例,点击输入框右边的上下按钮对输入框数字进行+1/-1调整效果。jquery插件有easyui NumberSpinner组件或jqueryui的spinner组件style .spinner{zoom:1;overflow:auto;border:solid 1px #ccc;float:left;} .spinner input{border:none;float:left;margin-top:5px} .spinner .arrow{float:right;font-size:12px;} ..

javascript特殊用法解密

评论(0)浏览(236)分类:JavaScript/Ajax开发技巧
javascript特殊用法解密 1. Null是个对象  JavaScript众多类型中有个Null类型,它有个唯一的值null, 即它的字面量,定义为完全没有任何意义的值。其表现得像个对象,如下检测代码:script alert(typeof null); //弹出 'object'/script如下截图:  尽管typeof值显示是object,但null并不认为是一个对象实例。要知道,JavaScript中的值都是对象实例,每个数..

javascript新历农历联动示例

评论(0)浏览(319)分类:JavaScript/Ajax开发技巧
javascript新历农历联动示例  javascript新历农历联动示例lunar.js这个js文件查看这篇文章:JavaScript阳历转阴历源代码,将里面的js代码保存为lunar.js文件,或者点击这里下载  javascript新历农历联动示例源代码script function toCNNumber(v) { var r = '', cn = 'O一二三四五六七八九十'; v = v.toString(); for (var i =..

JavaScript阳历转阴历源代码

评论(0)浏览(493)分类:JavaScript/Ajax开发技巧
JavaScript阳历转阴历源代码  JavaScript阳历转阴历源代码,JavaScript阴历转阳历源代码,从百度搞下来的阳历转阴历代码script (function () { var j = [43856, 19416, 19168, 42352, 21717, 53856, 55632, 25940, 22191, 39632, 21970, 19168, 42422, 42192, 53840, 53845, 46415, 54944, 44450, 38320, 18807, 18815, 42160, 46261, 27216, 27968, 43860, 11..

javascript判断浏览器是否关闭

评论(0)浏览(751)分类:JavaScript/Ajax开发技巧
javascript判断浏览器是否关闭  javascript判断浏览器是否关闭,本示例仅对IE8-浏览器有效,其他浏览器在关闭时无法获取到点击事件的clientX,clientY的坐标值。测试代码如下script window.onbeforeunload = function (e) { e = e || window.event; var y = e.clientY; if (y = 0//点击浏览器或者选项卡的关闭按钮 || y = Math.max(documen..

js遍历表单组合成键值对字符串

评论(0)浏览(263)分类:JavaScript/Ajax开发技巧
js遍历表单组合成键值对字符串  JavaScript将表单对象中输入控件组合成键值对字符串,方便ajax提交数据。和jQuery表单的serialize方法一样 function serializeForm(f) {//参数f为表单这个DOM对象 var params = '', tmp; for (var i = 0; i f.elements.length; i++) { if (f.elements[i].name) { ..

js区分webkit核心浏览器chrome,360浏览器

评论(0)浏览(770)分类:JavaScript/Ajax开发技巧
js区分webkit核心浏览器chrome,360浏览器  javascript如何识别webkit核心浏览器是哪种厂商的浏览器,如chrome,360急速,360安全,猎豹,世界之窗,搜狗,qq,百度之类的浏览器,核心都是webkit的,如何区分出不同的厂商。  一般区分浏览器厂商是通过navigator.userAgent来判断特殊字符来实现,但是webkit核心浏览器有些时候navigator.userAgent是完全一样的,不会增加特殊内容(如..

jquery多级下拉菜单插件

评论(0)浏览(410)分类:JavaScript/Ajax开发技巧
jquery多级下拉菜单插件  居于jquery框架的网站多级下拉菜单插件,融合了jquery.color.js,jquery.lavalamp.js,jquery.easing.js 这3个插件,效果如下图link rel=Stylesheet type=text/css href=/menu/menu.css /stylebody{background:#999}/stylediv id=menu ul class=menu li a href=# class=parentspanlevel 1_1/span/a ul ..

js prototype继承new分析

评论(0)浏览(216)分类:JavaScript/Ajax开发技巧
js prototype继承new分析  js的继承prototype,得先说下new的过程。  看看这样一段代码:script type=text/javascriptvar Person = function () { };var p = new Person();/script  很简单的一段代码,我们来看看这个new究竟做了什么?我们可以把new的过程拆分成以下三步:1 var p={}; 也就是说,初始化一个对象p。2 p.__proto__=Person.prototype;3 Person.call(..

js禁止滚动窗体页面

评论(0)浏览(300)分类:JavaScript/Ajax开发技巧
js禁止滚动窗体页面  js如何禁止鼠标,键盘滚动页面。(提示:无法控制右边出现的滚动条)titlejs禁止滚动页面/titlescript //spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36 var keys = { 37: 1, 38: 1, 39: 1, 40: 1, 35: 1, 36: 1 }; function preventDefault(e) { e = e || window.event; if (e.preventDefault) ..

IE/Firefox/W3C浏览器代码触发事件

评论(0)浏览(218)分类:JavaScript/Ajax开发技巧
IE/Firefox/W3C浏览器代码触发事件  firefox或者w3c浏览器没有直接在DOM中添加onclick事件,而是通过addEventListener添加事件时,无法使用 DOMObject.onclick()使用这种方法触发事件,但是可以通过dispatchEvent来触发。  测试代码如下div id=dvEvtdiv的内容/divinput type=button value=触发事件 onclick=btnFireEvent() /script type=text/javascript var dv; windo..