易截截图软件、单文件、免安装、纯绿色、仅160KB

静态页面onload方法增加Ajax后对变量的影响

这几天一直在研究treeTable(是一款jQuery的插件),这款插件将普通的表,变成一个可以收缩的treeTable。这种表格主要应用于权限处理,可以使用户一目了然地看见各个资源的继承关系。 上图就是一个简单的treeTable图例。 但是该表是一个静态的表,表格里的内容是一次性从服务器上获取下来,然后插件根据tr的id以及class构建table的层级关系。我的tr以及td的html代码是程序动态生成的,然后输出在页面上,页面加载完成后,利用jQuery给表格的每一列增加一个click事件,用来鼠标点击变换图片。 但是有的时候表格会很大,一个分支下有很多子分支,这时加载表格就需要耗费一些时间了,而子目录的动态加载能很方便的缓解这种压力。因为treeTable插件不支持Ajax,所以自己动手扩展Ajax功能,页面只加载第一级的分支,通过Ajax动态加载子分支。思路确定以后俺就开始“起立咔嚓”地整代码,1小时后treeTable改造完成,鼠标点击分支,动态去数据库读取子分支的数据。心里还挺美的,但是突然发现一个问题:      我页面上的click事件出现问题了,新加载上去的子分支,点击图片不会发生变换。查看页面js方法,发现click的方法是在页面加载完成后进行设置的,而这个时候动态的子分支还没有出现,所以必然导致新的分支没有被加载click方法。而且还有另一个诡异的现象:目前【内部论坛】以及【国内新闻】是动态加载上去的,这个时候点击【图片库】发现【内部论坛】的图片发生了改变,而【内部论坛】所在的位置又恰恰是刚才【图片库】所在的位置。产生这种现象的原因是:【内部论坛】在table中的位置以前是【图片库】的,所以【图片库】的click被触发后,该方法会去改变第3行(也就是以前【图片库】所在行)的图片。 解决方案:click方法直接写入每个td中(因为td是通过后台程序加载的,所以很容易增加click方法),这样新加载的分支也有click方法了。 产生这种问题的原因:在写加载click的方法时,没有考虑到动态的情况。以java代码来考虑客户端,客户端onload方式只在页面加载时才执行。页面加载完成后不再执行,以后再使用该方法时:需要注意变量即方法的调用及使用。


相关文档:

xtree dwr (ajax)异步加载每个树结点的代码

 tree.js
function getRank(rankNum)
{
 var rankName="";
 switch(rankNum)
 {
  case 1:
   {
    rankName="(普通会员)";
    break;
   }
   case 2:
   {
 &n ......

Ajax的简单应用

前台代码:
<head runat="server">
    <title>无标题页</title>
    <script src="Ajax.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div&g ......

c#中的Ajax上手篇---JSON的传送与接收

本篇文章主要介绍如何在Ajax的客户端与服务端之间传送JSON格式的数据。那么我们先来说说什么是JSON吧。
JSON,即是JavaScript对象标记法,英文名称是JavaScript Object Notation,简称JSON
,是 JavaScript Programming Language,
Standard
ECMA-262 3rd Edition - December 1999
的子集合,是从JavaScript的o ......

ajax select 添加option 空白

 今天动态添加option到selectl时,出现了添加后option为空白,个数却正确的情况。代码如下:
for(var i = 0; i < results.length; i++) {
        oOption = document.createElement("OPTION");
        oOption.value=results[i].child ......

一款经典的ajax登录页面 后台asp.net

 1,新建一名为login.htm的静态网页文件,作为登录页面,如图
body标签代码
<body onkeydown ="enterLogin()"> <!--添加按下键盘事件-->
<div style="text-align: center" mce_style="text-align: center">
<table border="1" cellpadding="1">
<tr>
<td align="center" s ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号