jQuery easyui通过点击tree节点动态添加tab

评论(0)浏览(3139)分类：easyui开发技巧
jQuery easyui通过点击tree节点动态添加tab　　要实现的效果：点击easyui tree节点，如果tree节点包含href属性，则动态的往easyui tabs对象添加一个tab，tab加载href中指向的url地址内容。　　实现要点：href属性不是easyui tree数据源的标准配置，所以需要将非标配数据放到attributes节点中，要不直接放到数据节点中获取不到附加数据Every node can contains following properties: id: ..

easyui datagrid detailview加载时全部自动展开显示详细信息

评论(0)浏览(3056)分类：easyui开发技巧
easyui datagrid detailview加载时全部自动展开显示详细信息　　使用easyui datagrid detailview插件时，在easyui datagrid加载完毕后如何将默认隐藏的detailview详细内容显示出来。　　可以在onLoadSuccess事件中触发detailview展开按钮的click事件即可。　　本示例居于jquery-easyui-1.3.5，如果没有效果，可以用开发工具看下detailview展开按钮是那种标签，增加了什么样式，不同不版本可能不同，需要修..

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..

jqGrid单元格编辑select联动示例

评论(0)浏览(2934)分类：jqGrid中文API
jqGrid单元格编辑select联动示例　　2013-09-18更新：更正colModel不可动态修改，colModel配置可以动态的通过setColProp方法进行修改，包括editoptions配置。具体示例查看这篇文章：jqGrid单元格编辑动态设置editoptions dataUrl实现select联动示例　　jqGrid启用单元格编辑，当设置编辑元素为select，如何依据另外一列的值来动态加载select的option。如省市联动，修改市的内容..

jqGrid工具栏查询

评论(0)浏览(2931)分类：jqGrid中文API
jqGrid工具栏查询　　这个方法在grid表头下面构造搜索表单。当表头改变宽度，搜索元素也会自动调整大小适应新表头宽度。此方法使用jqGrid配置的url作为查询服务器获取数据的接口。当执行查询时，键值对对象被提交到服务器（配置的url地址），此数据附加到postData参数，仅提交输入过内容的字段。当清空查询表单，附加的数据会从postData中删除。提交服务器的数据..

获取easyui datagrid正在编辑的数据行

评论(0)浏览(2917)分类：easyui开发技巧
获取easyui datagrid正在编辑的数据行　　javascript判断easyui datagrid是否在编辑状态，及如何获取当前正在编辑的数据行数据。　　获取easyui datagrid正在编辑的数据行源代码如下 function getEditRow(datagridId) {//datagridId为table容器的id var input = $('#' + datagridId).parent().find('div.datagrid-body input'), row; ..

fullCalendar设置日期td样式

评论(1)浏览(2915)分类：JavaScript/Ajax开发技巧
fullCalendar设置日期td样式　　本示例通过遍历fullCalendar显示日期的容器，和要设置特殊样式的日期进行对比，对比成功则设置此日期的容器的样式为给定的参数样式。2013-12-31更新：增加当前年月限制，防止跨年月设置。2014-01-02更新：增加周/日显示模式的高亮控制，增加的高亮改为控制通过样式控制，方便更换模式或者点击上下箭头切换日期后清空高亮显示，具体看代码解释..

jqGrid高级查询

评论(0)浏览(2903)分类：jqGrid中文API
jqGrid高级查询　　高级查询可以同时查询多个字段，使用不同的条件。单字段和高级查询使用相同的方法，但是配置和提交的数据不一样。安装要使用这个模块，你需要在下载页面勾选Common, Form Edit, filter插件，下载地址：http://www.trirand.com/blog/?page_id=6调用方式jQuery(#grid_id).searchGrid( {multipleSearch:true,...} );//新 APIjQuery(#grid_id).j..

iframe和父页，window.open打开页面之间的引用

评论(0)浏览(2902)分类：JavaScript/Ajax开发技巧
iframe和父页，window.open打开页面之间的引用　　iframe和父页，window.open打开页面和被打开页面之间的关系可以通过下面的对象获取到　　1)通过iframe加载的，在iframe中用parent对象得到父页window作用域，如果iframe中又加载了iframe，在最里层的iframe中需要重复调用parent直到得到需要的父页作用域（如parent.parent）。如果是直接引用最顶级的父页作用域，可以使用top对象。　　2)父页..

jqGrid预定义格式化类型

评论(0)浏览(2843)分类：jqGrid中文API
jqGrid预定义格式化类型　　格式化程序支持在表单，行，单元格编辑中将内容以自定义想要的格式来显示。格式化程序有２种形式，预定义的和自定义的，这节我们介绍的为预定义的格式化程序。jqGrid模块需求要使用格式化特性，需要在下载页面勾选 Formatter module后再下载jqGrid，下载地址：http://www.trirand.com/blog/?page_id=6。语言选项格式化选项语言在语言文件中定..

HTML5 FileReader对象API,FileReader使用文档

评论(0)浏览(2812)分类：JavaScript/Ajax开发技巧
HTML5 FileReader对象API,FileReader使用文档　　使用FileReader对象,web应用程序可以异步的读取存储在用户计算机上的文件(或者原始数据缓冲)内容,可以使用File对象或者Blob对象来指定所要读取的文件或数据.其中File对象可以是来自用户在一个input元素上选择文件后返回的FileList对象,也可以来自由拖放操作生成的 DataTransfer对象,还可以是来自在一个HTMLCanvasElement上执行mozGetAsFile(..

jplayer使用说明文档API

评论(0)浏览(2802)分类：JavaScript/Ajax开发技巧
jplayer使用说明文档APIjPlayer 2.1.0 开发指南如果你第一次使用jPlayer，请参考入门指南（ Quick Start Guide）。有其他问题，查看支持页面的FAQ。jPlayer API中文文档jPlayer 基础jPlayer支持的媚态格式Setting the size of jPlayerFlash Security RulesMedia EncodingServer ResponseHow to disable jPlayer with CSS or jQueryjPlayer FilesPlugin FilesSource Fil..

easyui datagrid datailview使用子表格后数据不对齐解决办法

评论(0)浏览(2754)分类：easyui开发技巧
easyui datagrid datailview使用子表格后数据不对齐解决办法　　easyui datagrid datailview，当dataview加载的是datagrid对象，子datagrid使用ajax异步加载数据时，前面的展开符号列高度没有变化，导致内容和前面的内容无法对齐，如下图所示　　而实际效果应该如下图解决办法：增加onLoadSuccess事件重设前面展开部分的高度，因为展开部分和内容是分开的。var columns = [[{ field: 'TestPoint_ID..

easyui datagrid单击单元格选择此列

评论(0)浏览(2727)分类：easyui开发技巧
easyui datagrid单击单元格选择此列　　本示例代码实现单击jquery easyui datagrid的单元格时，取消datagrid默认选中高亮此行的样式，改为选中单击的单元格所在的列，高亮此列上的所有单元格。可以配置全局single变量，只允许同时选中一列，如果不配置则默认可以选中多列。单击选中的列会取消选中高亮样式。　　源代码如下，示例测试的easyui版本为1.3.5，如果没有效果，自己用fir..

JSONP跨域访问在线代理API

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

让IE8-浏览器支持html5 placeholder属性，支持password类型

评论(0)浏览(2680)分类：JavaScript/Ajax开发技巧
让IE8-浏览器支持html5 placeholder属性，支持password类型　　placeholder是html5的属性，可以在文本框内显示提示内容，而这个提示内容确不会提交到服务器。IE8-不支持html5，所以需要使用js来实现placeholder效果。　　本示例居于jquery框架，让IE8-浏览器支持html5 placeholder属性，支持password类型源代码如下script type=text/javascript src=http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2...

Ext整合显示echarts示例

评论(0)浏览(2652)分类：extjs开发技巧
Ext整合显示echarts示例　　echarts图标如何显示在extjs的panel对象中。　　Ext整合显示echarts源代码如下!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN http://www.w3.org/TR/html4/strict.dtdhtmlheadmeta http-equiv=Content-Type content=text/html; charset=utf-8 /titleExt中整合echarts示例/titlelink rel=stylesheet type=text/css href=../../resources/cs..

如何阻止微信打开网页下拉显示黑色背景

评论(0)浏览(2652)分类：JavaScript/Ajax开发技巧
如何阻止微信打开网页下拉显示黑色背景　　网页在微信中打开时，处于第一屏，如果触屏往下滑动时，在屏幕上方会显示一个黑色背景块显示网页由xxxx提供，QQ浏览器x5内核提供技术支持的信息。　　如何禁止触屏下滑显示这个信息呢，解决办法就是添加touchstart和touchend事件，在touchstart中阻止默认事件，touchend中设置body或者documentElement的scrollTop来实现滚动。　　如何阻止网..

jQuery.cookie.js中文API

评论(1)浏览(2647)分类：JavaScript/Ajax开发技巧
jQuery.cookie.js中文APIjquery.cookie.js中文API一个简单，轻量级的jQuery插件，用于读，写，删除浏览器cookie。安装将最后贴出的jQuery.cookie.js源代码保存为js文件，然后在jQuery类库后面用script导入jquery.cookie.js文件。script src=/path/to/jquery.js/scriptscript src=/path/to/jquery.cookie.js/script备注：不要直接引用GitHub网站的jquery.cookie.js文件。..

动态更新的内容如何以瀑布流masonry重新布局

评论(0)浏览(2639)分类：JavaScript/Ajax开发技巧
动态更新的内容如何以瀑布流masonry重新布局　　页面第一次加载完毕后执行了masonry绘制瀑布流布局后，后续使用javascript或者ajax更新的节点内容要以masonry瀑布流布局添加到容器里面，可以使用2种方法使新增加的内容以瀑布流的形式呈现1）对总容器调用masonry的reload方法将会重绘容器节点内的所有内容2）对新添加的节点执行masonry的appended方法，对新添加的节点计算新新节点的位置后以..

Selection.getRangeAt方法

评论(0)浏览(2629)分类：JavaScript/Ajax开发技巧
Selection.getRangeAt方法Selection.getRangeAt简介Returns a range object representing one of the ranges currently selected.使用语法range = sel.getRangeAt(index)参数rangerange 为返回的对象index从0开始，返回指定小标的range对象。负值或者大于等于 rangeCount 的数字将会报错示例var ranges = [];sel = window.getSelection();for(var i = 0; i sel.rangeCou..

textarea设置下划线格式

评论(0)浏览(2606)分类：HTML/CSS兼容/XML
textarea设置下划线格式功能要求：1：如何实现在多行文本框textarea里面每一行下面都有一条横线 2：textarea文本框里面有一段不能删掉实现方法：横线用背景图片来做，不动的文字用浮动层+给textarea增加text-indent来实现缩进。源代码如下：style type=text/css.input{position:relative}.word{position:absolute;line-height:20px;left:0px;top:1px;z-index:10;backgr..

datagrid没有数据显示无数据提示信息

评论(0)浏览(2599)分类：easyui开发技巧
datagrid没有数据显示无数据提示信息　　本示例实现easyui datagrid加载/查询数据时，如果没有相关记录，则在datagrid中显示没有相关记录的提示信息，效果如下图所示　　本示例easyui版本为1.3.4，如果运行后没有效果，自己检查easyui版本不同版本对appendRow和mergeCells支持不一样，参数不一致什么的。无法隐藏分页导航容器，可以用chrome开发工具或者firebug查看分页导航容器的样..

jqGrid：treeGrid嵌套集合模型

评论(0)浏览(2597)分类：jqGrid中文API
jqGrid：treeGrid嵌套集合模型　　如jqGrid treegrid配置中提到的，treeReader属性很重要。了解分层数据管理-嵌套集合模式的基本概念，将会更容易配置这个属性。treeReader配置　　默认嵌套集合模型的（nested set model）treeReader配置如下treeReader : { level_field: level, left_field:lft, right_field: rgt, leaf_field: isLeaf, expanded_field: expa..

easyui datagrid跨域加载jsonp数据源

评论(0)浏览(2535)分类：easyui开发技巧
easyui datagrid跨域加载jsonp数据源　　easyui datagrid加载jsonp数据源示例。如果datagrid要加载跨域的数据，跨域页面提供的数据格式为非jsonp数据，当直接配置datagrid的url启用ajax加载地址时，即使url返回的数据格式符合datagrid格式的json字符串，由于浏览器安全问题，ajax是不允许跨域请求的（除非设置动态页设置过：Access-Control-Allow-Origin响应头），导致无法获取到数..

javascript生成二维码

评论(0)浏览(2504)分类：JavaScript/Ajax开发技巧
javascript生成二维码　　jquery.qrcode.js 是居于jquery类库的绘制二维码的插件，用它来实现二维码图形渲染支持canvas和table两种绘图方式。（jquery.qrcode.js 设置显示方式为table时在webkit核心浏览器如chrome下会变形，这个需要注意。）　　下面为测试代码（增加了颜色控制，可以设置4个区块的颜色值，需要指定render为table。），效果如下htmlheadtitleJS生成二..

jqgrid自适应列宽度

评论(0)浏览(2503)分类：JavaScript/Ajax开发技巧
jqgrid自适应列宽度　　目的：自动显示完jqgrid中每一列的内容，而不是隐藏起来。没找到jqgrid提供的自适应列宽度的方法，只好参考了下jqgrid最终生成的DOM结构，直接用jquery操作DOM结构实现自适应列宽度功能。　　实现方法：用一个新的表格，样式继承自jqgrid的样式，用来计算数据源中每一列的实际宽度，然后设置标头和内容表格中用来控制宽度的单元格。　　备注..

XMLHttpRequest Level 2新特性介绍

评论(0)浏览(2449)分类：JavaScript/Ajax开发技巧
XMLHttpRequest Level 2新特性介绍作者： 阮一峰日期： 2012年9月 8日XMLHttpRequest是一个浏览器接口，使得Javascript可以进行HTTP(S)通信。最早，微软在IE 5引进了这个接口。因为它太有用，其他浏览器也模仿部署了，ajax操作因此得以诞生。但是，这个接口一直没有标准化，每家浏览器的实现或多或少有点不同。HTML 5的概念形成后，W3C开始考虑标准化这个接口。2008年2月，就提出..

easyui datagrid本地排序后，添加，更新的数据行如何显示在正确位置

评论(0)浏览(2402)分类：easyui开发技巧
easyui datagrid本地排序后，添加，更新的数据行如何显示在正确位置　　easyui的插件datagrid配置某些列的允许排序，并且关闭了远程排序（remoteSort:false），当点击排序列排序后，如果插入的数据行，或者修改某数据行对应排序的列值时，如何使添加或者修改后的数据行按照当前的排序方法进行排序后显示在对应的位置，而不是插入到最后或者显示在原来的位置。　　easyui的datagrid没有提供相关的方法，需要自己写..

IE浏览器下获取file控件选择本地文件的路径

评论(0)浏览(2317)分类：JavaScript/Ajax开发技巧
IE浏览器下获取file控件选择本地文件的路径　　由于安全问题，IE7+浏览器的internet区域的安全设置中将文件上传到服务器时包含本地目录路径选项默认是禁用的，所以通过file.value得到的不是实际选择的本地文件的路径，而是定位到c:\fjkk\等乱七八糟的路径去，文件名是正确的，路径不正确。　　IE浏览器下面可以使用selection对象获取到真实的本地选择文件的路径，firefox需要设置安全性，..