第3页_Web前端开发

chrome开发工具source选项卡找不到js文件

2015-11-3评论(0)浏览(654)分类：JavaScript/Ajax开发技巧

　　chrome开发工具的sources选项卡会记录浏览器加载的所有资源文件，包括js，css，html资源文件。但是对于使用ajax动态加载的js，css文件，sources选项卡是不会显示此类文件，chrome开发工具的sources选项卡只会记录使用script，link标签加载的js，css资源文件。　　如下面的html示例，chrome sources选项卡如下图所示，没有1.js文件记录。scri..

JavaScript如何检查网站是否可以访问

2015-12-10评论(0)浏览(1035)分类：JavaScript/Ajax开发技巧

　　JavaScript如何检查网站是否出现问题，无法访问。由于安全性问题，不可以跨域执行ajax代码，可以使用Image对象来加载对方服务器的一张图片(一般网站都会有网站图标，这个图标放在根目录下)，所以可以加载网站图标来判断是否可用。注意：Image加载的需要是图片，其他非图片文件无法检查网站是否可以访问，即使网站没有问题。titleJavaScript如..

javascript滚动到导航条时如何固定在顶部

2012-11-1评论(0)浏览(1802)分类：JavaScript/Ajax开发技巧

　　当页面上面的不在第一屏显示的导航条，javascript如何将导航条固定在顶部当次导航条已经显示并且滚动到顶部将隐藏的时候。　　下面为这个效果的源代码，为了简便，使用了jquery框架div style=height:500px;background:#999/divdiv id=fixedMenu style=background:#eee;width:100%;菜单/divdiv style=height:900px;background:#999/divscript..

jquery全年日期选择器日历插件

2016-8-26评论(13)浏览(964)分类：JavaScript/Ajax开发技巧

2017-8-2更新1)：新增setColors设置单元格颜色，param格式为{defaultColor:'#f00',dc:[{d:'2017-8-2',c:'blue'}..]}，dc数组c缺省会用defaultColor代替，defaultColor也缺省默认红色2)将2016-9-28更新整合到yearScale配置里面，配置这个年份变为下拉框，格式如{min:2000,max:2020}2016-9-28更新：如果需要年份选择可以下..

标准浏览器下oninput如何响应javascript动态设置值

2013-9-4评论(0)浏览(794)分类：JavaScript/Ajax开发技巧

　　在标准浏览器下，如firefox或者chrome，oninput事件只有输入或者粘贴剪裁的时候才会响应，而javascript动态设置控件的值时不响应oninput事件，而ie浏览器下的onpropertychange事件则会响应javascript动态设置控件内容时。　　要解决oninput不响应javascript动态设置值，可以使用__defineSetter__重新定义value属性值，然后调用oninput事件。..

easyui datagrid数据导出excel文件示例

2014-4-3评论(9)浏览(6093)分类：easyui开发技巧

　　2017-2-3更新：判断列隐藏（调用过hideColumn），将不会导出隐藏的的列内容。　　2015-9-16更新：判断列是否配置过formmater函数，配置则调用formmater函数得到显示的数据。否则导出的数据是原始数据源中的数据，而非formmater后的数据。　　2015-9-22更新：如果浏览器不支持data:application/vnd.ms-excel;base64,协议导出excel文件（如ie）..

easyui datagrid合并主键值一样的记录

2017-5-25评论(0)浏览(299)分类：easyui开发技巧

　　easyui datagrid如何将相同主键值的记录进行数据合并，显示在第一行，数据源截图和默认datagrid显示效果如下，数据源其实就是下载的压缩包里面jquery-easyui-1.4.1\demo\datagrid\datagrid_data1.json改的，将productid改相同几个。未合并前显示效果数据源截图示例合并后效果easyui datagrid合并主键值一样的记录源代码如下 script ..

KindEditor IE11下粘贴到最后bug解决办法

2017-5-22评论(0)浏览(272)分类：JavaScript/Ajax开发技巧

　　KindEditor 4.1.6在 IE11，内容比较多出现滚动条时，如果想在内容中间粘贴其他内容，会导致粘贴的内容被粘贴到编辑器最后，而不是在光标所在位置。资料引用：https://github.com/kindsoft/kindeditor/pull/193/commits/7e6cde5adc8d105fb2888b038e8e9164a5dd2129#diff-1c90ff38a08209f9ebd4d05d1e43358eKindEditor 4.1.7http://blog.csdn.ne..

kindeditor链接添加SEO rel nofollow

2017-5-22评论(0)浏览(206)分类：JavaScript/Ajax开发技巧

　　kindeditor如何给链接添加SEO rel属性 nofollow不跟踪外链，效果如下图所示。　　kindeditor版本为KindEditor 4.1.6，其他版本自己按照如下步骤修改源代码，主要是kindeditor-min.js的修改比较麻烦，压缩过的。1）修改配置语言，下载压缩包 lang\zh_CN.js新增如下配置'link.url' : 'URL','link.linkType' : '打..

extjs combobox省市县3级联动示例

2017-5-10评论(0)浏览(381)分类：extjs开发技巧

　　extjs combobox省市县3级联动示例，示例居于ext-4.1.1a，4+版本应该不会出错，3-自己注意修改store的创建模式，3+和4+是extjs的分水岭，store创建基本完全不一样，自己对照api修改如果需要兼容3-版本的extjs。　　extjs combobox省市县3级联动示例源代码如下!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN http://www.w3.org/TR/html4/str..

microsoft.xmldom加载xml错误缺少所需的空白区

2017-5-10评论(0)浏览(440)分类：HTML/CSS兼容/XML

　　用microsoft.xmldom加载xml文件时，如果xml文件添加了DTD，DTD元素名称和说明之间要存在空格，否则会报错。错误原因：缺少所需的空白区。错误行：1　　测试代码如下test.htmlscript var xml = new ActiveXObject(microsoft.xmldom); xml.async = false; xml.validateOnParse = true; xml.load(book.xml); document.write(..

canvas保存为图片，兼容IE9+，chrome，Firefox

2017-5-6评论(0)浏览(833)分类：JavaScript/Ajax开发技巧

　　javascript将canvas对象保存为图片示例，兼容IE9+，chrome，Firefox，效果如下firefox将canvas对象保存为图片chrome将canvas对象保存为图片IE11将canvas对象保存为图片　　javascript将canvas保存为图片源代码如下titlejavascript将canvas对象保存为图片示例/titlecanvas id=c/canvasbr /input type=button value=保存canvas为图片 onclick=..

文字查询焦点效果

2017-5-4评论(0)浏览(277)分类：JavaScript/Ajax开发技巧

　　文字查询效果，js自动设置查询条件焦点样式，如下图所示　　文字查询效果，js自动设置查询条件焦点样式源代码如下，需要导入jquery框架style a{text-decoration:none} a.cur{background:#00afc7;color:#fff;font-weight:bold;}/stylediv id=dvFilter!--查询条件，容器div增加rel属性存储次条件的查询键名称，连接只需要生成此查询的键..

js css3 3d翻牌效果

2017-4-28评论(0)浏览(288)分类：HTML/CSS兼容/XML

!doctype htmlhtml lang=enhead meta http-equiv=Content-Type content=text/html; charset= utf-8 titlecss3 3d翻牌效果/title style* {margin:0;padding:0;list-style-type:none;}.warperMain01_2 {height:auto;background: #eff1f0;font-family:微软雅黑;overflow:hidden; margin:0 !important; padding:5em 0;}.warperMain01_2 h1{..

浮动层div遮盖select

2009-6-12评论(0)浏览(238)分类：HTML/CSS兼容/XML

htmlhead meta http-equiv=Content-Type content=text/html; charset=gb2312 titleJK:支持民族工业,尽量少买X货/title/headbody div style=z-index:10;position:absolute;width:100;height:18;overflow:hidden; onmouseover=this.style.height=100; onmouseout=this.style.height=18; iframe style=position:absolute;z-index:-1;width:100%;he..

easyui combobox删除指定项目

2017-4-14评论(1)浏览(773)分类：easyui开发技巧

　　easyui combobox没有提供datagrid类似的deleteRow方法删除数据行，要删除combobox的下拉项目，可以直接操作数据源来实现easyUI combobox下拉项目的删除。getData获取数据后删除数据源中的项目，然后再loadData加载下数据源就行。　　easyui combobox删除指定项目源代码如下，居于jquery-easyui-1.4.3/demo/combobox/basic.html修改。script ..

easyui datebox只显示年月选择，隐藏日期

2015-1-6评论(19)浏览(13757)分类：easyui开发技巧

2017-4-14更新：修正1.3.x版本弹出日期框后，不选择日期点击其他地方，再次点击日期输入框弹出面板时显示日期面板，而不是月份面板bug。2016-10-28更新：修正1.3.x版本中点击Today按钮弹出日期选择面板问题。　　如何设置easyui的datebox只选择年月，不用选选择日期。easyui的datebox没有提供这种配置只通过点击月份弹出层就可以设置日期控件值，..

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

2013-12-30评论(0)浏览(3137)分类：easyui开发技巧

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

百度地图搜索当前用户位置附近停车场示例

2017-3-30评论(0)浏览(380)分类：JavaScript/Ajax开发技巧

　　百度地图搜索当前用户位置附近停车场，公园，餐馆示例思路就是用BMap.Geolocation类获取经纬度http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html#a7b34然后使用BMap.LocalSearch进行搜索停车场http://lbsyun.baidu.com/index.php?title=jspopular/guide/service#.E6.9C.AC.E5.9C.B0.E6.90.9C.E7.B4.A2经测试使用BMap.Geolo..

JavaScript调用百度地图显示驾车，步行导航示例

2017-3-30评论(0)浏览(369)分类：JavaScript/Ajax开发技巧

　　JavaScript调用百度地图显示驾车，步行导航示例JavaScript调用百度地图显示驾车，步行导航示例源代码如下htmlhead meta http-equiv=Content-Type content=text/html; charset=utf-8 / meta name=viewport content=initial-scale=1.0, user-scalable=no / style type=text/cssbody, html {width: 100%;height: 100%; margin:0;font-f..

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

2015-9-11评论(0)浏览(2646)分类：JavaScript/Ajax开发技巧

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

addEventListener第三个参数useCapture说明

2017-3-28评论(0)浏览(272)分类：JavaScript/Ajax开发技巧

　　addEventListener第三个参数useCapture为布尔变量（true/false），用于指定事件使用冒泡（false）还是捕获（capture）方式，一般设置未false，使用冒泡方式。　　以下面示例说明addEventListener第三个参数useCapture配置不同值，点击最里层Level3执行顺序。titleaddEventListener第三个参数useCapture说明/titlestylediv{border:solid 1px ..

JavaScript调用百度语音朗读信息

2017-3-28评论(1)浏览(419)分类：JavaScript/Ajax开发技巧

　　titleJavaScript利用百度语音服务朗读文字示例/title名字：input type=text id=txtName /br其他：input type=text id=txtOther /input type=button onclick=setSrc() value=朗读/div id=dvAudio/divscript type=text/javascript function setSrc() { var t = (document.getElementById('txtName').value + ' ' + ..

JavaScript模拟冒泡排序

2017-3-20评论(0)浏览(154)分类：JavaScript/Ajax开发技巧

　　JavaScript模拟冒泡排序排序过程，冒泡排序模拟过程效果!DOCTYPE htmlhtml lang=enheadmeta charset=UTF-8titleJavaScript模拟冒泡排序/titlestyle type=text/cssdiv div{width: 10px;background-color: red;display: inline-block;margin-right: 1px;text-align: center;line-height: 30px;}#show {width: 500px;height: 300px;margin-left..

kindeditor预览窗口如何全屏显示

2017-3-14评论(0)浏览(640)分类：JavaScript/Ajax开发技巧

　　如何修改kindeditor预览窗口全屏实现，kindeditor的预览窗口不是全屏的，如果要改为全屏预览，可以修改kindeditor\plugins\preview\preview.js文件如下即可实现全屏预览（注意修改窗口大小是不会自适应的，只是点击预览按钮时当前窗口大小）。/******************************************************************************** KindEdito..

js文字查询条件选择查询效果

2016-2-24评论(0)浏览(347)分类：JavaScript/Ajax开发技巧

　　js实现类似京东的查询条件选择效果。titlejs实现类似京东的查询条件选择效果/titlestyle div.condition{border:solid 1px #eee;} div.condition a{margin-right:10px} div.condition a.selected,div.condition a:hover{background:#0094ff;color:#fff;}/stylescript src=http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.j..