JavaScript与HTML
Nov
27
Extjs中的帮助文档中都是些简单的查询,grid的分页查询只是默认传入start,limit,sort,dir等参数,但实际情况中可能需要传入自定义参数,试了好多次都没有发布传入
在网上找一个一个办法,利用JsonStore的beforeload事件来强制添加自定义的参数列表即可以实现,关键代码如下:
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;
});
在网上找一个一个办法,利用JsonStore的beforeload事件来强制添加自定义的参数列表即可以实现,关键代码如下:
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;
});
Jun
30
先来看一个简单的例子:
下面以三个页面分别命名为frame.html、top.html、bottom.html为例来具体说明如何做。
frame.html 由上(top.html)下(bottom.html)两个页面组成,代码如下:
<!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>
下面以三个页面分别命名为frame.html、top.html、bottom.html为例来具体说明如何做。
frame.html 由上(top.html)下(bottom.html)两个页面组成,代码如下:
<!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>
Jun
11
在IE6中GridPanel如果不是设置成固定的宽度,则会出现一个很长的滚动条,整个GridPanel似乎变得有页面10倍宽,
解决方法:
修改ext-all.css第 #337 行:
.x-grid3-header-offset{padding-left:1px;width:10000px;}
to
.x-grid3-header-offset{padding-left:1px;width:auto;}
或者直接在页面中加入:
<style type="text/css">
.x-grid3-header-offset{padding-left:1px;width:auto;}
</style>
解决方法:
修改ext-all.css第 #337 行:
.x-grid3-header-offset{padding-left:1px;width:10000px;}
to
.x-grid3-header-offset{padding-left:1px;width:auto;}
或者直接在页面中加入:
<style type="text/css">
.x-grid3-header-offset{padding-left:1px;width:auto;}
</style>
Jun
10
禁止用户手动输入input[type="file"]的文件路径,最简单的方式是
<input type="file" ContentEditable="false" />
Jun
10
"#"包含了一个位置信息
默认的锚点是#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=""
默认的锚点是#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=""
Apr
7
经常会用到的一些代码,又比较容易忘记,再次收藏一下。
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>
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>
Apr
7
jQuery each迴圈中的continue及break
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;
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;
Jul
25
引用
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,便能更进一步提高数据的保密性,这正是现在金融交易网络的流行做法。
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,便能更进一步提高数据的保密性,这正是现在金融交易网络的流行做法。
Jul
4
EXT中的TabPanel如果需要把被用户关闭的页缓存,则在TabPanel的属性中加入如下:
listeners:{//当前侦听到关闭事件时,把要关闭的Panel隐藏
remove: function(tp, c) {
c.hide();
}
},
autoDestroy:false,//被关闭的Panel不会被自动释放
===========================================================
初始化组件的方法要在Ext.onReady里的执行,要不然很有可能报错,因为之前浏览器页面还没有加载好其元素不完整。
listeners:{//当前侦听到关闭事件时,把要关闭的Panel隐藏
remove: function(tp, c) {
c.hide();
}
},
autoDestroy:false,//被关闭的Panel不会被自动释放
初始化组件的方法要在Ext.onReady里的执行,要不然很有可能报错,因为之前浏览器页面还没有加载好其元素不完整。
Jun
28
昨日用了Ext Tree组件做一个东西,需要用到ajax对节点逐级加载,开始数据用的静态数据data.txt,一切程序都测好了然后放到系统中测试,将data.txt换成了servlet,发现什么都不显示,单独访问servlet也能正常返回json数据,猜想应该是出现ajax调用错误了,检查了传递的参数与服务端需要的参数名也丝毫没有问题,Loader的代码大致是这样的:
Jun
22
Visual Studio 2008的Ext 2.0.2智能提示.它提供了非常准确的Ext API提示。
如图:
下载地址:
下载文件
引用方法:
1、将下载回来的文件解压,并放入你的项目中。
2、新建一个.js文件,在代码行的顶部加入以下备注
如图:
下载地址:
下载文件 引用方法:
1、将下载回来的文件解压,并放入你的项目中。
2、新建一个.js文件,在代码行的顶部加入以下备注
Jun
22
最近正在研究extjs,可以访问http://www.extjs.com
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
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






