分类目录归档:JavaScript

All about JavaScript, :)

[原] 建了一个google code项目:jquery myhint plugin

在这里:http://code.google.com/p/jquery-myhint-plugin/

easy to use myhint plugin:

效果:

[原] 一种将数据表DataTable转为JSON格式的新方法

最近实现一种将数据表转为JSON表示的新方法。
这种方法表示的JSON数据更省空间(尤其是网络传输,能省很多数据量),使用起来也很方便。
假设有这样一张数据表:

ID Name Location
1 周杰伦 香港
2 侯佩岑 台湾
3 张靓颖 大陆

一般的JSON表示方法为:

可以看到,数据表的字段信息(column)在每条记录里都写了一遍,比较浪费空间。如果字段很多很长,甚至会比有效内容更多。随着记录数增加,浪费的数据量是很可观的。尤其像以前小百合BBS自己付流量费的时候,流量啊流量。。。。。。

我实现的表示方法产生的JSON格式是这样的:

这种方法将字段信息单独提取到C属性里,而D属性是纯粹的记录数据。
其实D属性本身已经完全能表示记录内容,C属性只是为了使用时方便。
在这短短几个字段及几条数据的极端情况下,已经省下几十字节。

下面对比使用方法,我承认这种方法稍微比通用的方法复杂一点,但是带来的节省,个人认为还是值得的:

下面是上述DataTable转JSON的C#代码

[原] jquery-easyui的combotree在.net开发中不显示数据的问题

最近使用jquery-easyui 1.2,遇到一个问题。
一搜索,发现好多人在问:
问题见:http://jquery-easyui.wikidot.com/forum/t-248817/combotree-net
“combotree在.net开发中,一直不显示数据。
单独html页面就可以显示出来。同一数据文件,json格式绝对正确。”

解决问题首先要发现原因,用firebug试了一下,发现是combotree读取json的时候是用POST方法。
而.net环境不支持静态文件用POST方法获取内容。错误如下:

发现原因后,解决问题就简单很多。
找到easyui的js代码:

在我的应用中,因为不需要POST方式获取json,就把type:”post”改为type:”get”即可。
已在easyui的官方论坛中说明这个问题,希望以后能多个method的设置选项。

2010.12.18 更新:
新版本jquery-easyui 1.2.1提供了tree组件的method方法设置,但是在用css自动解析方式时无效。
即通过《input class=”easyui-combotree” url=”…js” method=”get” /》调用时,仍然使用POST。
查看代码,原来是这里parseOptions时未对method进行解析:

问题解决。

[原] 基于jQuery的自动TAB选项卡实现

jQuery挺好用,我就不说啥了。
今天实现了“自动TAB”,下面分享一下。有人会问为啥不用jquery-ui,主要是页面css已经全弄好了,实在不想为ui再写一次;其次是ui毕竟是那么大个家伙,心疼我的性能。
HTML页面非常简单:

之后就是用jQuery自动对这个.tabBox进行处理,加上鼠标点击自动切换的功能(当然可以加上鼠标移过的选项支持,作为示例,我就没写那么完善):

[原] 给LilyBBS新增源代码语法高亮功能

原文:[公告] WEB新增源代码语法高亮功能

使用方法:
[code]
代码
[/code]

目前支持:C/C++、Java、Python、Bash、SQL、HTML、XML、CSS、Javascript、Makefile、Ruby、PHP、Awk、Perl

效果示例:

#include <stdio.h>
int main() {
    printf
(“Many people think they are full of niubility,”);
}

import org.bianbian.code;
class CodeTest() {
   
public static void main(String[] args) {
       
System.out.println(“and like to play zhuangbility,”);
   
}
}

<?php
    echo
‘which only reflect their shability.’;
?>

采用的是prettify,为LilyBBS的客户端解析UBB做了点修改。推荐一下,还是挺好用的。

[原] 关于正则表达式批量替换字符串解决方案答网友问

发信人: Net (BBS上没有什么事情是bg不能解决的), 信区: WebDesign
标 题: Re: 如何使用正则分别替换?
发信站: 南京大学小百合站 (Sun Apr 20 15:21:23 2008)

不太可能一句话搞定,不过有相对而言的解决办法:
1) 简单易懂

2) 勉强算一句话吧。。。

【 在 superphoenix (格云朱雀) 的大作中提到: 】
: 比如要将一个字符串中的A替换为asdf,B替换成fdsa,C替换成……
: 能不能用一个正则话就替换成功?
: 而不是写成str=str.replace(/A/g,”asdf”).replace(/B/g,”fdsa”)….
: 谢谢!

※ 来源:.南京大学小百合站 bbs.nju.edu.cn.[FROM: Net.nEt.neT.Orz]

[原] 关于web访问小百合BBS的脚本问题

最近发现个别网友访问小百合BBS会出现如下提示:

见到此文字可能是由于浏览器禁用了活动脚本或者脚本有误
请启用脚本支持后刷新本页;若仍有问题,请点击这里提问

原理:使用Javascript动态输出框架结构(好处是能缓存静态化网页,区别guest用户和登录用户)。因此,一旦这步出现错误,框架结构未建立成功,那么就会显示body里的提示内容。

原因:
(1)浏览器版本不支持。目前小百合BBS支持IE5.5(不保证全部功能有效),完美支持IE6+、Firefox 2.0+、Opera 9+等。如果您的浏览器不在此列,并且测试正常,欢迎反馈。
(2)浏览器脚本引擎未启用。您可以点击这里测试:如果能弹出“脚本启用”,那说明这项没有问题;否则,请修改设置如下:
Firefox:firefox_script_enable.JPG IE:ie_script_enable.JPG
(3)脚本有误。可能性不是很大,除非刚好碰到更新的脚本确实存在错误。基本上我都会测试以后才放上去。不过万一你怀疑是这个问题,可以telnet方式到sysop版看看,如果其他人都没问题那基本就只是您的问题了。
(4)浏览器缓存内的脚本版本过旧。因为浏览器缓存脚本文件(这样不需要每次都下载,加快速度),如果服务器端已经更新了脚本文件,而您的浏览器缓存因为各种原因没有更新,可能也会导致这个问题。请清空浏览器缓存后刷新测试:
Firefox:firefox_del_temp.JPG IE:ie_del_temp.JPG
(5)校内用户访问BBS请关闭代理服务器。
(6)浏览器或系统部分DLL(动态链接库)功能因为病毒或木马的原因失效(Windows系统),请点此下载修复程序,保存后运行,然后重新打开浏览器测试。

如果还有问题,请留言将您的操作系统、浏览器(基本是IE出问题)及版本、杀毒软件等告知。另外推荐使用Chrome

[译] JavaScript (XMLHttpRequest) 读取二进制数据流

译者注:原来想用JS直接处理C丢过来的struct数据,具体可以查看:[原] C的struct和JSON交互
经过千辛万苦的查找,找到了这篇文章(作者应该比我更辛苦):Downloading Binary Streams with Javascript XMLHttpRequest
把关键点翻译如下(不过我还没有测试):
利用XMLHttpRequest的overrideMimeType方法设置charset为x-user-defined。

IE不支持overrideMimeType方法,不过有评论者说VBScript可以实现:

[原] 支持IE和Firefox的鼠标滚轮事件JavaScript代码

滚轮IE和Firefox的代码不一样:
IE是mousewheel事件,Firefox是DOMMouseScroll事件
事件属性,IE是event.wheelDelta,Firefox是event.detail
属性的方向值也不一样,IE向上滚 > 0,Firefox向下滚 > 0

[原] 模仿Google Map的FY2C实时云图平台上线~

模仿Google Map(图片切片载入在此平台不需要实现):

支持IE、Firefox等,支持鼠标移动、鼠标双击放大(左键)缩小(右键)、鼠标滚轮放大缩小

云图实时处理和发布(因为在学校内网,实时版本大家不能看到啦)

这里贴下演示地址(只有最后两个时次的图片):FY2C实时云图平台演示

[原] 关于Javascript的this关键字答网友问

发信人: Net (BBS上没有什么事情是bg不能解决的), 信区: WebDesign
标 题: Re: Javascript问题
发信站: 南京大学小百合站 (Tue Mar 25 01:16:03 2008)

Javascript里的this和其他OO语言不一样
Javascript其实并不适合做OO,其实OO也并不适合Javascript
扯远了。。。。。。
this你就当“执行函数的宿主”理解。因此在一串函数的执行过程中,this不停地在变。

为了解决这个问题,很多框架对此进行了包装。
比如Prototype,用bind,实际是动态生成一个function,把宿主作为动态function的执行者,这样对用户来说,this似乎没有变化。

实际只要明白this是执行者的指针,一切都可迎刃而解。

[原] IE模拟鼠标右键双击事件

IE实在太垃圾了,再鄙视一次。。。鼠标右键双击居然没有。。。。
只好用onmouseup事件模拟一个(基于Prototype 1.6):

[原] 也许是prototype框架的bug

不知道怎么给prototype提交bug report,就写在这里吧:
其实我没有测试过,只是看prototype源码的时候,觉得是个bug:
对String的原型(prototype)添加toJSON()函数只是转义了引号,未转义”\”:

如果用户在input里输入\\,转成string应该是”\\\\”,如果没有转义,再写回去的时候就丢了一个\
应该在转义引号前先转义\: