IE7-浏览器设置子容器innerHTML会导致父容器offsetTop更改

评论(0)浏览(287)分类：HTML/CSS兼容/XML
IE7-浏览器设置子容器innerHTML会导致父容器offsetTop更改　　今天碰到一个问题，IE7-浏览器下（或者Quirks模式下），如果设置设置子容器的innerHTML，当设置的内容为table并且包含了align=center，会导致父容器的offsetTop增加，从而使父容器向下移动。　　测试代码如下，子容器table没有align=center属性，设置子容器不会修改父容器的offsetTop属性div id=bb style=border:1px solid gray;overflow:hi..

javascript实现平方米，亩，公顷单位换算

评论(0)浏览(168)分类：JavaScript/Ajax开发技巧
javascript实现平方米，亩，公顷单位换算　　javascript实现平方米，亩，公顷单位换算，可以通过url传递参数指定输入框的值为任何中单位的值。　　源代码如下 select onchange=selectChange(this) id=sel option value =公顷公顷/option option value =亩亩/option option value=平方米平方米/option /select 这个input的值可能是3公顷、3亩、3平方米 inp..

数组sort排序方法webkit浏览器(chrome)排序错乱

评论(0)浏览(291)分类：JavaScript/Ajax开发技巧
数组sort排序方法webkit浏览器(chrome)排序错乱　　javascript调用数组的sort方法对数组进行排序的时候，注意传递进入sort方法函数要返回0（相等），正数（大于），负数（小于）这3种数字，不能返回true/false，要不在webkit核心浏览下（如chrome，搜狗高速模式）可能导致排序出错。　　异类排序script var arr = [1, 4, 5, 3, 2, 6, 7]; arr.sort(function (a, b) { return b a });//..

Ext4如何判断tabpanel是否已经存在某个tab

评论(0)浏览(1125)分类：extjs开发技巧
Ext4如何判断tabpanel是否已经存在某个tab　　ext4如何判断tabpanel中是否已经存在某个tab，如果存在就激活这个tab，否则重新打开tab。　　原理：在tabpanel添加tab的时候增加tab的id配置，然后通过Ext.getCmp获取控件，如果不存在则添加此tab，否则调用tabpanel的setActiveTab方法激活此tab。　　示例代码，点击左边菜单treepanel的叶子节点时，在右边的tabpanel中动态添加tab，在添加前..

window.open打开网址报错：已经计划系统关机

评论(0)浏览(338)分类：JavaScript/Ajax开发技巧
window.open打开网址报错：已经计划系统关机　　javascript调用window.open打开网站的时候，IE浏览器下报错：已经计划系统关机　　百度找了下都是莫名其妙的自动好了，可以查看这个帖子：诡异的JS，已经计划系统关机错误。　　于是改用谷歌搜索相关英文内容，serverfault.com上也有人碰到过这个问题，满意答案还比较靠谱：IE8 script error 800704a6?The only information I've been a..

Ext.grid.property.Grid显示GridPanel数据行信息

评论(0)浏览(289)分类：extjs开发技巧
Ext.grid.property.Grid显示GridPanel数据行信息　　本示例通过Ext.window结合Ext.grid.property.Grid来实现GridPanel中的数据行详细信息显示，效果如下图所示　　主要源代码如下，修改自ext-4.1.1a\examples\grid目录下的array-grid.html这个示例，其他版本的ext如果没有效果自己查找对应的API看接口是否更改过 title: 'Array Grid', listeners: { 'select': fu..

datagrid编辑状态下调用acceptChanges后getChecked无法获取勾选的数据

评论(0)浏览(769)分类：easyui开发技巧
datagrid编辑状态下调用acceptChanges后getChecked无法获取勾选的数据　　easyui datagrid在编辑状态下，用鼠标勾选了数据行后，在调用acceptChanges接受数据更改，恢复到不可编辑状态时，此时调用getChecked无法获取到之前在编辑状态下勾选的数据，虽然此时数据行前面的复选框checkbox还是在勾选的状态。　　经过研究源代码发现，应该是easyui datagrid的bug，datagrid getChecked获取勾选的数据行是通过判断tr是否..

统计easyui datagrid某列之和显示在对应列下面

评论(0)浏览(5780)分类：easyui开发技巧
统计easyui datagrid某列之和显示在对应列下面　　本示例将计算easyui datagrid某些列的数据求和，然后将求和的数据显示在所在easyui列的最下面，实现统计功能，效果如下图　　源代码如下table id=dg/tablescript $(function () { $('#dg').datagrid({ singleSelect: true, onLoadSuccess: compute,//加载完毕后执行计算 url: 'prod..

IE7-容器内部的浮动元素float:left碰到容器边界内换行bug

评论(0)浏览(934)分类：HTML/CSS兼容/XML
IE7-容器内部的浮动元素float:left碰到容器边界内换行bug　　IE7-浏览器或者IE8浏览器下（没有添加xhtml申明的html），容器内部的浮动元素，当碰到容器的边界时，碰到边界的那个元素不会自动换到下一行显示，而是在当前行显示，超出剩余空间的文字自动在这个浮动元素内容换行显示，效果图如下firefox浏览器IE7浏览器IE6浏览器　　源代码如下style.xx{zoom:1;width:200px;}.xx a{ float: left; fo..

JScript+ActiveX获取访客MAC网卡地址

评论(0)浏览(115)分类：JavaScript/Ajax开发技巧
JScript+ActiveX获取访客MAC网卡地址　　JScript调用activeXObject获取访客的网卡MAC地址，注意只能IE下运行（IE8+没测试），会有安全提示在此页上的ActiveX控件和本页上的其他部分的交互可能不安全。你想允许这种交互吗？　　注意选择是，要不报错无法获取源代码如下 html head titleJScript+ActiveX获取访客MAC网卡地址/title /head body object cla..

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

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

easyui datagrid单击单元格选择此列

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

ajax getResponseHeader获取中文响应头

评论(0)浏览(1627)分类：JavaScript/Ajax开发技巧
ajax getResponseHeader获取中文响应头　　如果页面响应头中包含中文内容，ajax请求的页面和被请求的页面即使编码统一，不同浏览器下表现的方式还是会不一样，firefox/IE下出现乱码，chrome可以正常调用getResponseHeader获取到中文的响应头内容。　　要解决这个问题，可以将中文进行编码后在设置为响应头内容，这样ajax调动getResponseHeader获取内容后，在客户端解码下就不会出现乱..

easyui初始化隐藏tabs

评论(0)浏览(1911)分类：easyui开发技巧
easyui初始化隐藏tabs　　本示例实现jquery easyui在初始化的时候，自动隐藏其他tab。easyui tabs有3个tab，现在只显示title2选项卡，其他2个tabs选项卡隐藏起来。备注：请用easyui1.3+版本测试，低于这个版本的easyui隐藏其他tab有UI bug，默认显示的tab的内容部分被隐藏起来了。　　源代码如下!DOCTYPE htmlhtmlheadmeta charset=gb2312titleeasyui初始化隐藏tabs/..

selection对象中文API

评论(0)浏览(534)分类：JavaScript/Ajax开发技巧
selection对象中文API注意：这只是一个实验性的技术因为此项技术的标准还没有制定，尚需要修改，注意检查Selection对象属性及方法的浏览器兼容性（对应的介绍最下面会有相关的兼容新给介绍），而且这些属性及方法有可能在将来的浏览器版本中会变更。介绍Selection对象可以通过window.getSelection()或者其他方法返，通常通过 window.getSelection()返回父节点。Selec..

Selection.removeRange方法

评论(0)浏览(287)分类：JavaScript/Ajax开发技巧
Selection.removeRange方法Selection.removeRange简介从selection中移除一个range对象语法sel.removeRange(range)参数range从selection中移除的range对象示例/* 通过编程，可以选择多个range。 * 此示例将删除处第一个range外的其他range对象 */s = window.getSelection();if(s.rangeCount 1) { for(var i = 1; i s.rangeCount; i++) { s.removeRange(s.getRangeAt(i)..

Selection.selectAllChildren方法

评论(0)浏览(824)分类：JavaScript/Ajax开发技巧
Selection.selectAllChildren方法Selection.selectAllChildren简介将指定节点的所有子节点加到当前selection中，这个操作将会丢失之前选择的内容。语法sel.selectAllChildren(parentNode)参数parentNode选中parentNode参数的所有子元素，但是 parentNode 不会包含在当前selection中。示例footer = document.getElementById(footer);window.getSelection().selectAllChildren(fo..

Selection.modify方法

评论(0)浏览(407)分类：JavaScript/Ajax开发技巧
Selection.modify方法Selection.modify简介通过简单文本命令行，更改当前selection或者光标位置。备注：这个方法居于Webkit同名方法语法sel.modify(alter, direction, granularity)参数alter执行那种操作。执行move操作，将会移动当前光标位置。执行extend操作将会扩展当前selectiondirection如何调整当前selection。指定 forward或者 backward，通过当前selection的..

Selection.extend方法

评论(0)浏览(225)分类：JavaScript/Ajax开发技巧
Selection.extend方法Selection.extend简介将selection的结束点（focus）移动到指定的点。selection的开始点（anchor）不变。selection变为从开始点到新的结束点和方向无关。使用方法sel.extend(parentNode, offset)参数parentNode结束点移动到的节点offset结束点在parentNode参数中的位移来源：https://developer.mozilla.org/en-US/docs/Web/API/Selection.extend

Selection.collapse方法

评论(0)浏览(285)分类：JavaScript/Ajax开发技巧
Selection.collapse方法Selection.collapse简介将selection折叠为一个点。文档不会被修改。如果内容区域是可编辑的并且获取焦点，那么光标会在那个点闪动。使用语法sel.collapse(parentNode, offset);参数parentNode光标位置所在节点位置offset0 - 折叠selection从anchor位置到parentNode参数文本的开始位置1 - 折叠selection从anchor位置到parentNode参数文本的结束位..

Selection.getRangeAt方法

评论(0)浏览(2631)分类：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..

Selection.rangeCount属性

评论(0)浏览(356)分类：JavaScript/Ajax开发技巧
Selection.rangeCount属性Selection.rangeCount简介返回selection中range对象个数使用语法sel.rangeCount备注在用户点击一个新加载的页面前，rangeCount为0。用户可能一次只选择了一个range，所以rangeCount为1，一般也为1。但是通过脚本代码，可以让一个selection包含多个range。如Selection.addRange方法。来源：https://developer.mozilla.org/en-US/docs/Web/API/Sel..

Selection.addRange方法

评论(0)浏览(543)分类：JavaScript/Ajax开发技巧
Selection.addRange方法Selection.addRange方法简介将一个 Range 对象添加到 Selection对象中使用语法sel.addRange(range)参数range将被添加到 Selection中的Range 对象示例/* 选择html文档中的所有strong元素 */var strongs = document.getElementsByTagName(strong);var s = window.getSelection();if(s.rangeCount 0) s.removeAllRanges();for(var i = 0; i stron..

Selection.isCollapsed属性

评论(0)浏览(759)分类：JavaScript/Ajax开发技巧
Selection.isCollapsed属性Selection.isCollapsed简介返回一个布尔值表示selection的开始和结束是否重合（就是没有选择内容）语法sel.isCollapsed备注一个重合的selection，rangeCount属性也可能大于0。sel.getRangeAt(0) 会返回一个重合的range对象。来源：https://developer.mozilla.org/en-US/docs/Web/API/Selection.isCollapsed

Selection.anchorOffset属性

评论(0)浏览(342)分类：JavaScript/Ajax开发技巧
Selection.anchorOffset属性Selection.anchorOffset简介返回一个数字代表anchorNode.相对于selection锚（anchor）的位移。语法sel.anchorOffset注意事项返回的数字从0开始。如果selection从 anchorNode的第一个字符开始，则返回0来源：https://developer.mozilla.org/en-US/docs/Web/API/Selection.anchorOffset

lightbox效果，半透明遮盖层

评论(0)浏览(152)分类：JavaScript/Ajax开发技巧
lightbox效果，半透明遮盖层　　lightbox效果，半透明的遮盖层，遮盖文字内容效果，不允许操作style#mask{position:absolute;left:0px;top:0px;background:#000;opacity:.5;filter:alpha(opacity=50);display:none}/stylediv style=height:1000px内容input type=button value=显示lightbox onclick=showMask() //divscript var strict = document.compatMode == 'CS..

Selection.anchorNode属性

评论(0)浏览(1124)分类：JavaScript/Ajax开发技巧
Selection.anchorNode属性Selection.anchorNode简介返回selection起始节点语法sel.anchorNode备注用户选中文档内容时，有可能从左到右，也可能从右到左，锚（anchor）就是用户开始选择的地方。这个过程也可以通过键盘按住shift键，再安县方向键进行选择。selection的起始点（anchorNode）不会移动（改变），结束点会移动。来源：https://developer.mozilla.org/en-US/doc..

Selection.toString()方法

评论(0)浏览(341)分类：JavaScript/Ajax开发技巧
Selection.toString()方法Selection.toString()方法介绍返回当前selection对象的文本字符串内容。使用语法str=sel.toString()str：为selection对象中的文本字符串内容参数无描述返回当前选中的文本内容。当传递selection对象到一个需要字符串参数的javascript函数时，toString会自动调用alert(window.getSelection()) // What is calledalert(window.getSelection().toSt..

Range对象中文API

评论(0)浏览(740)分类：JavaScript/Ajax开发技巧
Range对象中文APIThe Range接口代表给定的文档的一个片段，这个片段包含节点集合和部分文本节点集合。Range可以通过document对象的createRange方法创建，可以通过Selection的getRangeAtgetRangeAt方法获取到。也可以通过 Range() 构造函数来生成。Range属性Range.collapsed ：只读返回 Boolean值只是Range开始和结束点是否重合。Range.commonAncestorContainer ：..

window.getSelection方法

评论(0)浏览(1828)分类：JavaScript/Ajax开发技巧
window.getSelection方法简介返回用户选择的对象。调用语法selection = window.getSelection() ;selection为Selection 对象。要转为字符串，可以链接空字符或者调用toString方法，将返回选中的文本内容。示例function foo() { var selObj = window.getSelection(); alert(selObj); var selRange = selObj.getRangeAt(0); // do stuff with the range}注意事..