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('/') }; }
微博内容增加内容图片转播到微博的功能
作者:大鹏 发布于:2012-3-29 0:44 Thursday
分类:JavaScript与HTML
标签: 图片分享 微博 转播
微博浏览内容时,鼠标移动到图片上去中增加图片分享功能。点击相应的社交网络图标可以将此图片分享到此社交网络上,此功能还有待完善。等完善之后再将使用方法分享出来供大家使用。
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]
table.innerHTML在IE下是只读属性
作者:大鹏 发布于:2011-7-6 15:02 Wednesday 分类:JavaScript与HTML
table.innerHTML在IE下是只读属性我们经常通过节点的innerHTML属性来填充节点,比如:
[code]
<div id="container1"> </div>
document.getElementById('container1').innerHTML = "Hello World!";
[/code]
但是在IE下设置table.innerHTML将会导致错误:
[code]
<table id="table1"> </table>
// works well in Firefox, but fail to work in IE
document.getElementById('table1').innerHTML = "<tr><td>Hello</td><td>World!</td></tr>";
[/code]
实际上,table, thead, tr, select等元素的innerHTML属性在IE下都是只读的。
那么如果动态的创建一个table呢,下面提供了一种可行的方法:
[code]
<div id="table1"> </div>
document.getElementById('table1').innerHTML = "<table><tr><td>Hello</td><td>World!</td></tr></table>";
[/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有一些有用的信息:
ExtJS中grid的JsonStore、Ext.PagingToolbar带条件查询问题
作者:大鹏 发布于:2009-11-27 8:54 Friday
分类:JavaScript与HTML
标签: extjs
在网上找一个一个办法,利用JsonStore的beforeload事件来强制添加自定义的参数列表即可以实现,关键代码如下:
[code]
var ds = new Ext.data.JsonStore({
url: "../Handlers/PageHandlerPage.aspx",
//url: "../Handlers/PageHandler.ashx",
root: "root",
totalProperty: "totalProperty",
id: "id",
baseParams:{id:Ext.get("txtId").dom.value,name:Ext.get("txtName").dom.value},
fields:["id","name","descn"
],
remoteSort:true
});
ds.on("beforeload", function(thiz, options) {
//debugger
thiz.baseParams["id"] = Ext.get("txtId").dom.value;
thiz.baseParams["name"] = Ext.get("txtName").dom.value;
});
[/code]
利用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]
ExtJsGridPanel中IE6中出现长滚动条的解决方法
作者:大鹏 发布于:2009-6-11 16:13 Thursday
分类:JavaScript与HTML
标签: extjs
解决方法:
修改ext-all.css第 #337 行:
[code]
.x-grid3-header-offset{padding-left:1px;width:10000px;}
[/code]
to
[code]
.x-grid3-header-offset{padding-left:1px;width:auto;}
[/code]
或者直接在页面中加入:
[code]
<style type="text/css">
.x-grid3-header-offset{padding-left:1px;width:auto;}
</style>
[/code]
禁止用户手动输入input[type="file"]的文件路径
作者:大鹏 发布于:2009-6-10 15:39 Wednesday
分类:JavaScript与HTML
标签: html
[code]<input type="file" ContentEditable="false" />[/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=""
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;
类似Gmail添加附件的效果
作者:大鹏 发布于:2008-11-13 23:34 Thursday
分类:JavaScript与HTML
标签: javascript ajax google gmail
Javascript实现的DES加密/解密程序
作者:大鹏 发布于:2008-7-25 9:39 Friday 分类:JavaScript与HTML
引用DES算法的入口参数有三个:Key、Data、Mode。其中Key为8个字节共64位,是DES算法的工作密钥;Data也为8个字节64位,是要被加密或被解密的数据;Mode为DES的工作方式,有两种:加密或解密。
DES算法是这样工作的:如Mode为加密,则用Key 去把数据Data进行加密,生成Data的密码形式(64位)作为DES的输出结果;如Mode为解密,则用Key去把密码形式的数据Data解密,还原为Data的明码形式(64 位)作为DES的输出结果。在通信网络的两端,双方约定一致的Key,在通信的源点用Key对核心数据进行DES加密,然后以密码形式在公共通信网(如电话网)中传输到通信网络的终点,数据到达目的地后,用同样的Key对密码数据进行解密,便再现了明码形式的核心数据。这样,便保证了核心数据(如PIN、 MAC等)在公共通信网中传输的安全性和可靠性。
通过定期在通信网络的源端和目的端同时改用新的Key,便能更进一步提高数据的保密性,这正是现在金融交易网络的流行做法。
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
如图: