让innerHTML里的script跑起来

评论(0)浏览(256)分类：JavaScript/Ajax开发技巧
让innerHTML里的script跑起来　　直接设置容器的innerHTML，如果设置的内容里面包含了script代码块，是不会执行的，所以需要做一些处理　　示例代码如下，firefox需要获取script标签，eval里面的内容，ie就简单了，在设置innerHTML前替换script为script defer就行了div id=dv/divscriptwindow.onload=function(){ var dv=document.getElementById('dv'); var s=&#..

jquery.validate.js valid方法及注意事项

评论(1)浏览(7660)分类：JavaScript/Ajax开发技巧
jquery.validate.js valid方法及注意事项　　1）jquery.validate.js第一次调用valid方法时，即使验证出错，也会返回true，第二次验证时如果还有错误才会才会返回false。所以不要根据调用valid方法返回的结果来判断是否要进行下一步的处理，有可能出问题。form id=myforminput type=text name=name1 requiredbr /input type=text name=name2 requiredbrbuttonValidate!/button/formscrip..

html5 required属性不用写js就能验证非空错误

评论(0)浏览(2064)分类：HTML/CSS兼容/XML
html5 required属性不用写js就能验证非空错误　　今天研究jquery.validation.js插件的时候，发现即使删除了页面上的所有js文件，提交表单的时候既然会提示请填写此字段的错误信息，神奇了。源代码如下form class=cmxform id=commentForm method=get action=label for=cemailE-Mail (required)/labelinput id=cemail type=email name=email required /pinput class=submit type=submit value..

li中嵌套img导致li垂直方向下端多出4px空白边解决办法

评论(0)浏览(303)分类：HTML/CSS兼容/XML
li中嵌套img导致li垂直方向下端多出4px空白边解决办法　　当li中嵌套了img元素时，li的垂直方向下端会莫名其妙的多出4px的空白边，ie6-7【以下简称ie】，firefox，chrome存在li空白边,firefox和ie6-7一样是4px，chrome下则是3px，IE8没有受到影响，神奇。。示例代码和布局图比较如下ul style=margin:0px;padding:0pxli style=margin:0px;padding:0px;zoom:1;overflow:hiddenimg src=v.png//li/ul　　..

输入框onchange,oninput,onpropertychange事件区别

评论(0)浏览(590)分类：HTML/CSS兼容/XML
输入框onchange,oninput,onpropertychange事件区别输入框（input）onchange,oninput,onpropertychange事件区别和兼容行分析onchange触发条件：输入框的值改变，失去焦点(onblur)后触发。兼容性：各浏览器都支持。oninputonpropertychange触发条件：输入时，实时触发，而不是失去焦点才触发。兼容性：oninput：Chrome/IE9/Firefox/Safari/Operaonpropertychange：IE6/IE7/IE8/IE9所以如果要实现输..

css修改鼠标选中内容显示样式

评论(0)浏览(181)分类：HTML/CSS兼容/XML
css修改鼠标选中内容显示样式　　通过样式修改鼠标选中的内容的颜色／背景色样式，而不是默认的深蓝色蓝底白色的字。　　本示例在IE8-浏览器下无效，如果是IE浏览器请升级到IE9+，chrome，opera，safari，firefox下运行看效果style*::-moz-selection{background:#93C; color:#FCF;}*::selection{background:#93C; color:#FCF;} /style通过样式修改鼠标选中的内容的颜色／背景..

让IE6支持css position：fixed定位

评论(0)浏览(137)分类：JavaScript/Ajax开发技巧
让IE6支持css position：fixed定位　　IE6不支持position:fixed，IE6不支持position:fixed，解决技巧使用Internet Explorer的CSS表达式(expression)。你不可以直接使用该表达式，因为它可能会因为缓存而不更新。解决这一点的最简单的方式是使用eval动态解析执行javascript语句。　　IE6下移动浮动层还会出现闪动问题，解决方法参考：解决ie下移动浮动层闪动问题　　让IE6支持posi..

解决ie下移动浮动层闪动问题

评论(0)浏览(779)分类：HTML/CSS兼容/XML
解决ie下移动浮动层闪动问题　　IE浏览器下如果使用setInterval/setTimeout计时器实现实时移动浮动层时，浮动层会有一些细微的闪动或者震动，因为IE有一个多步的渲染进程，当滚动或调整浏览器大小的时候，它将重置所有内容并重画页面，这个时候它就会重新处理css表达式。这会引起一个丑陋的闪动/振动bug，在此处固定位置的元素需要调整以跟上(页面的)滚动，就会出现跳动。　..

IE glow滤镜

评论(0)浏览(159)分类：HTML/CSS兼容/XML
IE glow滤镜　　IE glow滤镜：在对象边缘添加类似发光效果　　语法： STYLE=filter:Glow(Color=color,Strength=strength) 　　说明：Color:发光颜色. Strength:强度(0-100) 例子：filter:Glow(Color=#6699CC,Strength=5) 　　注意：作用域图片时，图片需要透明背景，要不不起作用。　　IE glow滤镜测试代码和效果style body{background:#ffffff} ..

IE gray，invert，xray滤镜

评论(0)浏览(110)分类：HTML/CSS兼容/XML
IE gray，invert，xray滤镜　　IE gray滤镜：把图片变为一张黑白颜色灰度图　　语法:：STYLE=filter:Gray　　IE invert滤镜：把对象的可视化属性全部翻转，包括色彩，饱和度和亮度　　语法：STYLE=filter:Invert　　IE Xray滤镜：使对象变得像被x光照射一样　　语法：STYLE=filter:Xray　　IE gray，invert，xray滤镜测试代码和效果style body{background:#ffffff} ..

模仿淘宝文本框内容放大效果

评论(0)浏览(117)分类：JavaScript/Ajax开发技巧
模仿淘宝文本框内容放大效果　　模仿淘宝的文本框内容放大效果，当输入框输入内容的时候，在文本框上部显示放大的文本框输入内容。输入框失去焦点或者内容为空时隐藏提示内容。效果如下源代码如下，兼容ie，firefox等主流浏览器，注意DOM结构。。br /br /style type=text/cssdiv.input{position:relative;width:230px;}div.input input{width:100%;border:solid 1px #0077f..

IE Chroma滤镜

评论(0)浏览(109)分类：HTML/CSS兼容/XML
IE Chroma滤镜　　IE Chroma滤镜：设置图片中指定的颜色为透明色，不显示原来的色彩语法filter:Chroma(Color=color)说明 ：color:#rrggbb格式，任意. 例子：filter:Chroma(Color=#FFFFFF) 备注：经测试，对文字容器的背景色不起作用，只作用于图片 IE Chroma滤镜示例style.chroma0{filter:Chroma(Color=#ff0000)}.chroma1{filter:Chroma(Color=#008000)}/sty..

IE FlipH,FlipV滤镜

评论(0)浏览(143)分类：HTML/CSS兼容/XML
IE FlipH,FlipV滤镜　　IE FlipH,FlipV滤镜：创建水平，垂直镜像语法filter:FlipVfilter:FlipHIE FlipH,FlipV滤镜示例，请在IE下运行stylebody{background:#ffffff}div{width:100px;height:100px;float:left;margin:0px 20px 20px 0px}.FlipH{filter:FlipH}.FlipV{filter:FlipV}/styledivFlipH,FlipV滤镜，原始效果/divdiv class=FlipH/作用于FlipH下的文字效果/di..

IE DropShadow滤镜

评论(0)浏览(167)分类：HTML/CSS兼容/XML
IE DropShadow滤镜　　IE DropShadow滤镜：创建对象的固定影子语法filter:DropShadow(Color=color,OffX=offX,OffY=offY,Positive=positive) 说明 Color:#rrggbb格式，任意. Offx:X轴偏离值. Offy:Y轴偏离值. Positive:1或0.如果为TRUE（非0），就为任何的非透明像素建立可见的投影 如果为FASLE（0），就为透明的像素部分建立透明效果 例子：filter:DropShadow..

IE blur滤镜

评论(0)浏览(191)分类：HTML/CSS兼容/XML
IE blur滤镜　　IE blur滤镜：创建高速度移动效果，即模糊效果语法filter:Blur(Add=add,Direction=direction,Strength=strength)说明 Add：是一个布尔值，一般来说，当滤镜用于图片时取0，用于文字时取1。文字设置add=1时会整个字体增加移动效果，会很模糊注意设置add的值。 Direction：模糊方向，以45度为单位改变，0为垂直向上，45向右上，90水平向右，13..

IE alpha滤镜

评论(0)浏览(167)分类：HTML/CSS兼容/XML
IE alpha滤镜　　IE alpha滤镜：设置透明层次语法 filter:Alpha(Opacity=opacity,FinishOpacity=finishopacity,Style=style,StartX=startX,StartY=startY,FinishX=finishX,FinishY=finishY)说明opacity代表透明度水准。默认的范围是从0 到 100，他们其实是百分比的形式。也就是说，0代表完全透明，100代表完全不透明。finishopacity是一个可选参数，如果想要..

FCKEditor换行br后的全角或者半角空格丢失解决办法

评论(0)浏览(362)分类：JavaScript/Ajax开发技巧
FCKEditor换行br后的全角或者半角空格丢失解决办法　　今天使用FCKEditor编辑器时，从记事本中复制内容到FCKEditor编辑器中，然后在开始的文字前面打入２个全角的空格进行缩进，提交后发现除了第一个段落的全角空格保存之外，其他的段落的全角空格全部没有了。　　经测试后发现，FCKEditor在W3C浏览器，如firefox，chrome，紧跟在br/换行后的全角或者半角空格在提交的时候，不知道被FCKEditor给做..

解决IE attachEvent绑定的事件中this为window问题

评论(0)浏览(272)分类：JavaScript/Ajax开发技巧
解决IE attachEvent绑定的事件中this为window问题　　在IE浏览器下使用attachEvent绑定对象的事件时，绑定的事件方法中this对象为window对象，而不是当前的DOM对象。w3c浏览器下的addEventListener对象不存在这种问题。　　测试代码如下div id=dv111/divscriptfunction Alert(){alert(this.innerHTML)}var dvs=document.getElementById('dv')dv.attachEvent('onclick',Alert);/..

submit控件click事件和form表单submit事件执行循序

评论(0)浏览(3390)分类：JavaScript/Ajax开发技巧
submit控件click事件和form表单submit事件执行循序　　表单中的submit按钮的clic事件优先于表单form的submit事件，表单submit事件的执行依据submit按钮的返回值来判断是否继续需要执行submit事件。表单的submit事件中return false也可以阻止表单的提交，而不一定依靠onsubmit事件返回false来阻止表单的提交。　　当submit的click事件返回false时，不会执行form表单的submit事件，返回非false值或..

iframe嵌套图吧地图在线标点地图

评论(0)浏览(208)分类：HTML/CSS兼容/XML
iframe嵌套图吧地图在线标点地图　　图吧地图在线标点地图在线生成地址：http://union.mapbar.com/onlineTagging.jsp，注册激活账户后生成地图标注界面如下　　图吧在线标点地图需要注册才能生成iframe引用的地址，效果如下。　　iframe引入的图吧在线标点地图效果

jquery mouseleave事件：移动到子容器select的option上也会触发

评论(0)浏览(515)分类：HTML/CSS兼容/XML
jquery mouseleave事件：移动到子容器select的option上也会触发　　当使用jquery给父容器绑定了mouseleave事件时，只有离开了父容器对象才会触发mouseleave事件，移动到子对象容器是不会触发的【注意不要使用mouseout事件，要不即使移动到的是父容器的子对象，如a也会触发mouseout事件。】　　但是今天碰到了一个特例，如果父容器中包含select对象，当展开select对象的option时，鼠标移动到option选项上，父容..

css控制英文字母的大小写

评论(0)浏览(501)分类：HTML/CSS兼容/XML
css控制英文字母的大小写　　css如何控制英文字母的大小写style.uc{text-transform:uppercase;/*用此样式后英文字母都显示为大写*/}.lc{text-transform:lowercase;/*用此样式后英文字母都显示为小写*/}/stylediv class=ucall the english word in this div be changed to upper case/divbr /div class=lcall the english word in this div be changed to lower case/div

定制ext4 combobox分页导航格式

评论(0)浏览(251)分类：extjs开发技巧
定制ext4 combobox分页导航格式　　本实例居于ext-4.1.1a，直接操作ext4生成的combobox分页DOM对象，隐藏不需要的导航对象，缩减导航条的长度。　　如果你使用的是其他版本的ext，可以先试试代码，如果没效果可能是DOM结构不一样或者一些方法不兼容导致出错，自己参考对应版本的ext的api修改代码，并用firebug或者其他调试工具查看combobox生成的导航条的DOM结构。　　本实例有..

css样式表important优先级大于内联style设置的样式

评论(0)浏览(3801)分类：HTML/CSS兼容/XML
css样式表important优先级大于内联style设置的样式　　今天发现css样式表中使用了important提高优先级后，尽然覆盖了内联样式style中设置的对应样式，老土了。。呵呵　　测试代码如下style.c{color:Red !important}/stylediv class=c style=color:Blue内联style样式无法覆盖样式表中的important，内容显示为红色，而不是内联样式设置的蓝色/div　　提高内联样式style的优先级也需要增加important..

window.open如何在新窗口打开连接

评论(1)浏览(195)分类：JavaScript/Ajax开发技巧
window.open如何在新窗口打开连接　　window.open如何在新窗口打开链接，而不是在浏览器的选项卡窗口中打开链接。　　经过测试，设置window.open的features参数，增加width和height参数，可以弹出一个浏览器窗口，而不是在原来浏览器的选项卡中打开链接。　　IE7，IE8，firefox12，chrome25.0.1364.172 m测试通过script function openWin() { window.open(top.locatio..

IE7 xhtml模式下position:relative overflow失效

评论(0)浏览(166)分类：HTML/CSS兼容/XML
IE7 xhtml模式下position:relative overflow失效　　IE7浏览器xhtml模式下，发现父容器设置了overflow:hidden/auto，子容器如果position为relative定位，父容器设置的overflow:hidden/auto失效，超出父容器的内容没有隐藏或者出现滚动条，而是直接显示出来，IE8+和其他浏览器如firefox没有问题。　　　ＩＥ８，显示正常IE7则内容直接显示，超出父容器范围　　测试代码!DOCTYPE html PUBLIC -//..

ckeditor注册ctrl+enter快捷键

评论(0)浏览(256)分类：JavaScript/Ajax开发技巧
ckeditor注册ctrl+enter快捷键2013-04-02更新：不要使用ckeditor的setData方法清空编辑器中的内容，此方法会重构iframe的document对象导致之前注册的ctrl+enter事件丢失，直接操作DOM对象清空body的内容即可。一定要调用setData方法，需要重新给新document对象添加事件，由于是异步的，所以需要传递回调函数，具体看最后的示例。　　由于ckeditor的编辑窗体是iframe，和父窗体..

Ext4 JSONStore使用webservice返回的json数据

评论(0)浏览(291)分类：extjs开发技巧
Ext4 JSONStore使用webservice返回的json数据　　asp.net framework3.5 webservice增加了检查content-type，如果请求头设置了content-type:'application/json'，就会返回json字符，而不是xml。　　首先我们要了解一下webservice返回的json结构。返回的json格式是{d:实际的内容}，实际内容根据webservice方法返回值来确定。1）如果是字符串字符，那么实际内容就是字符串。如果返回的..

Ext4 XMLStore加载webservice数据源示例

评论(0)浏览(332)分类：extjs开发技巧
Ext4 XMLStore加载webservice数据源示例　　Ext4使用XMLStore加载webservice时，返回XML不同返回json格式那么严格，返回json需要注意的事项多。　　返回xml和平时用ajax get/post请求普通页面一样，有参数get请求附加在url后面，post请求则在ajax对象的send中发送url键值对就行。　　只要配置过web.config允许get/post请求webservice后，就可以使用ajax请求webservice得到xml数据源。否..

jQuery通过调用webservice返回json数据的问题

评论(3)浏览(272)分类：JavaScript/Ajax开发技巧
jQuery通过调用webservice返回json数据的问题　　由于.net frameword3.5以上添加了对contenttype的检查，当ajax发送请求时，如果设置了contenttype为json，那么请求webservice时，会自动将返回的内容转为json的格式，json的格式如下{d:webservice方法返回的字符串内容}这时出现一个问题了，如果方法返回的是一个json格式的字符串，那么如何获得实际的json对象，而不是只有一个属性d的json对..