Mustache.js语法
作者:大鹏 发布于:2013-7-6 1:11 Saturday
分类:JavaScript与HTML
标签: javascript
1.简单的变量调换:{{name}}
var data = { "name": "Willy" }; Mustache.render("{{name}} is awesome.",data);
返回成果 Willy is awesome.
2.若是变量含有html的代码的,例如:<br>、<tr>等等而不想转义可以在用{{&name}}
var data = { "name" : "<br>Willy<br>" }; var output = Mustache.render("{{&name}} is awesome.", data); console.log(output);
javascript URL解析
作者:大鹏 发布于:2013-6-18 23:13 Tuesday
分类:JavaScript与HTML
标签: javascript
/** *@param {string} url 完整的URL地址 *@returns {object} 自定义的对象 *@description 用法示例:var myURL = parseURL('http://abc.com:8080/dir/index.html?id=255&m=hello#top'); myURL.file='index.html' myURL.hash= 'top' myURL.host= 'abc.com' myURL.query= '?id=255&m=hello' myURL.params= Object = { id: 255, m: hello } myURL.path= '/dir/index.html' myURL.segments= Array = ['dir', 'index.html'] myURL.port= '8080' myURL.protocol= 'http' myURL.source= 'http://abc.com:8080/dir/index.html?id=255&m=hello#top' */ function parseURL(url) { var a = document.createElement('a'); a.href = url; return { source: url, protocol: a.protocol.replace(':',''), host: a.hostname, port: a.port, query: a.search, params: (function(){ var ret = {}, seg = a.search.replace(/^\?/,'').split('&'), len = seg.length, i = 0, s; for (;i<len;i++) { if (!seg[i]) { continue; } s = seg[i].split('='); ret[s[0]] = s[1]; } return ret; })(), file: (a.pathname.match(/\/([^\/?#]+)$/i) || [,''])[1], hash: a.hash.replace('#',''), path: a.pathname.replace(/^([^\/])/,'/$1'), relative: (a.href.match(/tps?:\/\/[^\/]+(.+)/) || [,''])[1], segments: a.pathname.replace(/^\//,'').split('/') }; }
image图像预加载
作者:大鹏 发布于:2011-7-6 15:31 Wednesday
分类:JavaScript与HTML
标签: javascript
[code]
var source = ['img1.gif','img2.gif'];
var img = new Image();
for(var i = 0; i < source.length; i++) {
img.src = source[i];
}
[/code]
以上方法只能预加载最后一张,修改为下面的代码之后才能全部预加载:
[code]
var source = ['img1.gif','img2.gif'];
for(var i = 0; i < source.length; i++) {
var img = new Image();
img.src = source[i];
}
[/code]
0.1+0.2 != 0.3
作者:大鹏 发布于:2011-7-6 15:03 Wednesday
分类:JavaScript与HTML
标签: javascript
JavaScript将小数作为浮点数对待,所以可能会产生一些四舍五入的错误,比如:
[code]
0.1 + 0.2; // 0.30000000000000004
[/code]
你可以通过toFixed方法指定四舍五入的小数位数:
[code]
(0.1 + 0.2).toFixed(); // "0"
[/code]
[code]
(0.1 + 0.2).toFixed(1); // "0.3"
[/code]
jQuery和ExtJS的timeOut超时设置和event事件处理
作者:大鹏 发布于:2010-4-3 14:23 Saturday
分类:JavaScript与HTML
标签: javascript ajax extjs jquery 超时
对jQuery 来说,超时可以直接设置timeout参数,并在error事件中捕获第二个参数,如果是“timeout”则表明捕获了超时事件,非常清楚。
例子:
[code]
$.ajax({
type: "POST"
,
contentType: "application/json"
,
url: "../ws/MyService.asmx/test"
,
data: '{"email":"'
+email+'"}'
,
timeout: 30000, //超时时间:30秒
dataType: 'json'
,
error: function
(XMLHttpRequest, textStatus, errorThrown){
//TODO: 处理status, http status code,超时 408
// 注意:如果发生了错误,错误信息(第二个参数)除了得到null之外,还可能
//是"timeout", "error", "notmodified" 和 "parsererror"。
},
success: function
(result) {
// TODO: check result
}
});
[/code]
另外,error事件返回的第一个参数XMLHttpRequest有一些有用的信息:
利用Javascript刷新网页方法大全(转)
作者:大鹏 发布于:2009-6-30 17:33 Tuesday
分类:JavaScript与HTML
标签: javascript
下面以三个页面分别命名为frame.html、top.html、bottom.html为例来具体说明如何做。
frame.html 由上(top.html)下(bottom.html)两个页面组成,代码如下:
[code]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> frame </TITLE>
</HEAD>
<frameset rows="50%,50%">
<frame name=top src="top.html">
<frame name=bottom src="bottom.html">
</frameset>
</HTML>
[/code]
a href="#" 与 a href="javascript:void(0)" 的区别
作者:大鹏 发布于:2009-6-10 14:28 Wednesday
分类:JavaScript与HTML
标签: javascript
默认的锚点是#top 也就是网页的上端
而javascript:void(0) 仅仅表示一个死链接
这就是为什么有的时候页面很长浏览链接明明是#可是跳动到了页首,而javascript:void(0) 则不是如此
所以调用脚本的时候最好用void(0)
或者<input onclick>
<div onclick>等
打开新窗口链接的几种办法
1.window.open('url')
2.用自定义函数
<script>
function openWin(tag,obj)
{
obj.target="_blank";
obj.href = "Web/Substation/Substation.aspx?stationno="+tag;
obj.click();
}
</script>
<a href="javascript:void(0)" onclick="openWin(3,this)">LINK_TEST</a>
window.location.href=""
String.format输出大括号
作者:大鹏 发布于:2009-4-11 16:19 Saturday
分类:Asp.Net 2.0
标签: javascript ajax .net json
以下是搜索到的部分内容:
[quote]
在C#中,string.Format是一个非常方便的格式字符串的方法。
比如为了输出Bill is a student.这个句子,就可以使用以下的方法:
string studentName = "Bill";
string.Format("{0} is a student.", studentName);
这样就可以动态的来格式化字符串。
可以发现,大括号是用来格式化字符串用的,也就是说,如果想格式化大括号,肯定是会出问题的。
实际中,编译可以通过,会报出一个运行时错误:字符串格式错误。
解决方法:
用“{{”或者“}}”来输出。
bool isMale = false;
string result = string.Format("get {{ return {0}; }}", isMale);
result的值应该是“get { return false; }”
[/quote]
这下可以解决输出大括号的问题了。在这里感谢文章的作者!
javascript 禁止复制 右键
作者:大鹏 发布于:2009-4-7 15:17 Tuesday
分类:JavaScript与HTML
标签: javascript
[code]
onselect="document.selection.empty()" oncopy="document.selection.empty()"
<!--禁止网页另存为: -->
<noscript><iframe src=*.html></iframe></noscript>
<!-- 禁止选择文本: -->
<script type="text/javascript">
var omitformtags = ["input", "textarea", "select"]
omitformtags = omitformtags.join("|")
function disableselect(e) {
if (omitformtags.indexOf(e.target.tagName.toLowerCase()) == -1)
return false
};
function reEnable() {
return true
};
if (typeof document.onselectstart != "undefined")
document.onselectstart = new Function("return false");
else {
document.onmousedown = disableselect;
document.onmouseup = reEnable;
}
</script>
<!-- 禁用右键: -->
<script>
function stop(){
return false;
}
document.oncontextmenu=stop;
</script>
[/code]
JQuery 相关用法
作者:大鹏 发布于:2009-4-7 14:24 Tuesday
分类:JavaScript与HTML
标签: javascript ajax jquery
continue :return true;
break :return false;
也可以利用return即可跳出jQuery
获取一组radio被选中项的值
var item = $('input[@name=items][@checked]').val();
获取select被选中项的文本
var item = $("select[@name=items] option[@selected]").text();
select下拉框的第二个元素为当前选中值
$('#select_id')[0].selectedIndex = 1;
radio单选组的第二个元素为当前选中值
$('input[@name=items]').get(1).checked = true;
eWebEditor在IE8中控件失效
作者:大鹏 发布于:2009-4-6 1:17 Monday
分类:网络资源
标签: javascript ajax
我有好几个网站,编辑器全用的那一个,也就是ewebeditor编辑器,因为这个鸟编辑器我前几天几乎所有的网站都被黑客攻击,今天又遇到这个问题,让我顿时对这个编辑器没了好感,所以近期也在自己开发一个编辑器,欢迎大家随时关注我的天道酬勤博客,我会把编辑器的源代码和系统讲解都会在那里公布,打造一个纯开源纯免费的编辑器。
问题是这样的,在ie8下ewebeditor的所有按钮都无效,因为ie8是当天发布的,所以网上也没有这样的解决办法,然后就换360浏览器,没想到360浏览器用的也是ie的内核,还是一样,没办法只能等等看了,毕竟这个编辑器不是自己写的,一时半会儿也找不到解决办法,于是到了第二天,终于在网上找到了解决办法:
类似Gmail添加附件的效果
作者:大鹏 发布于:2008-11-13 23:34 Thursday
分类:JavaScript与HTML
标签: javascript ajax google gmail
Extjs Tree通过递归删除子节点信息
作者:大鹏 发布于:2008-7-16 21:42 Wednesday
分类:JavaScript与HTML
标签: javascript extjs
function removeChildrenRecursively(node) { if (!node) return; while (node.hasChildNodes()) { removeChildrenRecursively(node.firstChild); node.removeChild(node.firstChild); } }
关于ExtJS中TabPanel的Tab页关闭后再打开组件无法显示的问题
作者:大鹏 发布于:2008-7-4 18:28 Friday
分类:JavaScript与HTML
标签: javascript ajax extjs
[code]
listeners:{//当前侦听到关闭事件时,把要关闭的Panel隐藏
remove: function(tp, c) {
c.hide();
}
},
autoDestroy:false,//被关闭的Panel不会被自动释放
[/code]===========================================================
初始化组件的方法要在Ext.onReady里的执行,要不然很有可能报错,因为之前浏览器页面还没有加载好其元素不完整。
EXT Ajax访问url返回405错误的解决办法
作者:大鹏 发布于:2008-6-28 15:48 Saturday
分类:JavaScript与HTML
标签: javascript ajax c#
Ext智能提示 - Dreamweaver CS3
作者:大鹏 发布于:2008-6-22 16:37 Sunday
分类:JavaScript与HTML
标签: javascript ajax .net
如图:
Ext智能提示 - Visual Studio 2008
作者:大鹏 发布于:2008-6-22 16:17 Sunday
分类:JavaScript与HTML
标签: javascript ajax .net c# vs2008
如图:
下载地址:
[file][/file]
引用方法:
1、将下载回来的文件解压,并放入你的项目中。
2、新建一个.js文件,在代码行的顶部加入以下备注
Ext js 中文的一些导读
作者:大鹏 发布于:2008-6-22 15:00 Sunday
分类:JavaScript与HTML
标签: javascript ajax
FAQ http://extjs.com/learn/Ext_FAQ
看了Demo以后简直是无法收拾了,从速度还有效果来看ajax.asp.net没有办法比了。
学习之前还是强烈推荐一下javascript 面向对象支持
另外这里还涉及到一些prototype的概念,可以参考Prototype.js深入学习的帖子,感觉还不错
PS一下,Ext js 有很多资源的索引 http://extjs.com/learn/Manual:Resources#OO_JavaScript
准备的工具
firefox +firebug 到各自的站点http://www.firefox.com 以及http://www.getfirefox.com 下载安装
关于firebug的介绍网络上有很多
还是强烈推荐一个视频的教程,原本是Ruby on Rail的辅助开发教程。不过其中的关于javascript prototype的教程实在是太出色了,如果对Ruby on Rail有兴趣可以全部看完。如果只是希望了解javascript prototype +firebug 就下载其中的一部分就可以
地址 http://lib.verycd.com/2007/05/10/0000149317.html
让IE也能用position:fixed
作者:大鹏 发布于:2008-4-17 16:30 Thursday
分类:JavaScript与HTML
标签: javascript css
所以只需要给IE设置一下fixed效果。
第一步让IE下#menu具有绝对定位
* html #menu {position:absolute;}/*only for ie*/结果看到有两个纵轴滚动条,外围是html的,内侧是body的。
第二步去掉外侧滚动条,因为外侧没有滚动效果
[code]html {overflow-x:auto; overflow-y:hidden;}[/code]
一个不错的JS函数库S.Sams Lifexperience ScriptClassLib
作者:大鹏 发布于:2008-2-13 0:45 Wednesday
分类:JavaScript与HTML
标签: javascript