极湖

为了实现 Ajax 方式的文件上传，在网上找到一个 AjaxFileUpload 的 jQuery 插件，能用，不过还是有一些不足，比如不能在文件上传的同时指定其他参数（hidden），还有一些不大不小的 Bug，于是修改了一下其代码。修改之后用法如下：

首先在 HTML 文件头部引入 jQuery 以及该插件：

<script type="text/javascript" src="jquery.pack.js"></script>
<script type="text/javascript" src="jquery.ajaxupload.js"></script>

然后写一个函数：

//*******************************************************
// Ajax文件上传
//*******************************************************
function uploadFile(fileId) {
    $("#uploading").ajaxStart(function(){
        $(this).show();
    }).ajaxComplete(function(){
        $(this).hide();
    });
    $.ajaxFileUpload({
        url: 'upload.php',
        secureuri: false,
        fileElementId: fileId,
        dataType: 'json',
        success: function (data, status) {
            alert("上传成功。\n" + e);
        },
        error: function (data, status, e) {
            alert("发生错误！\n" + e);
        },
        extFields: {
            user : 'guest',
            comment : '好'
        }
    });
    
    return false;
}

和原来相比，增加了 extFields 这个参数。
其中的 upload.php 就不在这儿贴代码了，如果不会写这个，就说不过去了。

最后是调用：

$("#upload_button").click(function () {
    uploadFile("my_file");
});

效果马马虎虎，还算过得去。

下载：
jquery.ajaxupload.js

做了《唐诗三百首》之后，利用已实现的自动播放代码，顺便做了逐句播放的《论语》。

网上《论语》的文字到处都有，我做这么一个东西，只是出于兴趣，为的是方便像我一样的懒人，读书不用翻页，不用点链接，甚至不需要滚屏。


网址：http://staticlake.appspot.com/lunyu/index.html
也可以用这个地址访问。

特点：

• 默认自动翻页。每次显示一句。
  
• 可以调整播放的速度，通过滑块调整。
  
• 可以按顺序播放，也可以随机播放。
  
• 完全用 JavaScript 实现（借用了 jQuery 库），对应三大浏览器(IE, Firefox, Opera)。
  

有兴趣不妨看看，也欢迎您提供宝贵意见。

jQuery 是个让人着迷的 JavaScript 库，这些天一直在学这个东西。

用 jQuery 作了几个日历之后，接下来想做一个“算命”的东西，那就是《易经》。

经过几天的琢磨，做出这么一个“易经六十四卦”的网页：


网址：http://staticlake.appspot.com/iching/index.html
如果在国外，也可以用这个地址访问。

网页看上去五颜六色，不是很美观，还需要调整。

特点：

• 用八卦图案合成六十四卦图案。
  
• 有鼠标提示，显示八卦和六十四卦的卦名等信息。
  
• 点击六十四卦图案，显示相应的经文，点击经文自动关闭文字框。
  
• 可以进行占卜，按顺序随机生成六个“1”或“0”的数字，组合后就是占卜的结果。
  
• 用了一点 Ajax 技术，对应三大浏览器(IE, Firefox, Opera)。
  

如果您对这个小东西感兴趣，欢迎提供意见。

＊更新＊

• 采用黑色背景的配色方案。(2007.9.1)
  
• 弹出窗口样式更新，增加关闭图标。去掉点击文字区域关闭窗口的功能。(2007.9.1)
  
• 增加白话文解析，原文和白话文通过 Tab 切换。(2007.9.2)
  

利用空闲时间，作了一个 日历 ，完全用 JavaScript 实现，用到了 jQuery 库，还用到了 jQuery 的插件 Tooltip 。

日历功能及特色：

• 用不同颜色显示节假日，鼠标移到日期上面即可显示该节假日名称。
  
• 默认显示今年日历，前后各有五年的日历链接。
  
• 除了前后五年的日历链接，还可以前后翻页。
  
• 点一下当前年度的标签，即可自由输入年分，按Enter键后显示输入年度的日历。（目前限制输入范围为0到10000）
  
• 对应三大浏览器：IE、Firefox、Opera。Safari、Konqueror等浏览器目前尚未测试。
  

日历外观如图所示：

因为常常要查看哪天是红日子（节假日），而且习惯了在网上查看日历，所以觉得这个东西还有点用。

网上有很多现成的日历，据我观察，生成日历的程序大多都在服务器端。实际上，JavaScript 功能足够强大，一个简单的日历程序，用浏览器本身足矣。

最近对 jQuery 比较感兴趣，有心学学这个东西，因此在这个库的基础上，做了这个日历程序。

以上日历，也可以通过这个地址访问。

该日历程序参考了维基百科的词条：日本のこよみ 。

*更新
鼠标提示增加日期的对应星座。(2007.08.16)

在html里面放一个id为'input_box'的文本输入框，再放一个id为'test_div'的div，就能用以下代码进行按键测试了。
（不要忘了引入jquery.js）

<script type="text/javascript">
<!--
$(function(){
    var InputBox = $("#input_box");

    //******************************
    //　KeyPress事件处理
    //******************************    
    InputBox.keypress( function(e) {
        $("#test_div").text("KeyPress: " + e.keyCode.toString());
    });
    
    //******************************
    //　KeyDown事件处理
    //******************************    
    InputBox.keydown( function(e) {
        $("#test_div").text("KeyDown: " + e.keyCode.toString());
    });
    
    //******************************
    //　KeyUp事件处理
    //******************************    
    InputBox.keyup( function(e) {
        $("#test_div").text("KeyUp: " + e.keyCode.toString());
    });

});
-->

看了一下W3G关于的文档，这几个Event发生的顺序是 onkeydown → onkeypress → onkeyup 。