小居

分类： 写写代码

  • 退出或刷新页面时提示

    先看代码

    // as my test, Opera do not fire the event
window.onbeforeunload = function (e) {
    e = e || window.event;

    // For IE and Firefox prior to version 4
    if (e) {
        e.returnValue = 'Sure to quit?';
    }

    // For Safari and Chrome
    return 'Sure to quit? Data might not be saved.';
};

    （更多…）

  • 使用 JavaScript 生成随机字符串

    用途：如 Oauth 认证等需要的等长随机字符串。

    /**
 * By James from http://www.xinotes.org/notes/note/515/
 */
function randomString(length) {
    var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz'.split('');

    if (! length) {
        length = Math.floor(Math.random() * chars.length);
    }

    var str = '';
    for (var i = 0; i < length; i++) {
        str += chars[Math.floor(Math.random() * chars.length)];
    }
    return str;
}

/* examples */

// generate a random string of random length
randomString();

// generate a random string of length 8
randomString(8);

  • Tab 切换可能引发 flash 重新下载

    Tab 切换是一个常见的功能特性，称呼好像很多，比如焦点图、舌签切换等，我常叫为 Tab 切换。一个示意图如下：

    yahoo tab 切换

    普通的切换显示文字、图片，甚至是 Ajax 加载一般都不会有什么问题，不过，最近在做 flash 切换的时候发现了个问题，采用 display:block / none 来控制显示隐藏会导致 flash 重新加载。需要说明的是，并不是简单的重新渲染，而是重新请求下载。

    （更多…）

  • 允许复制

    想复制些东西却发现用 JavaScript 禁止了复制，于是想起了 keakon 的『破解网页禁止复制的Chrome插件：Enable Copy』，不错相对于插件，我更喜欢 bookmarklet 这种形式，于是将插件中的代码提取了出来（作者介意否？）

    javascript:(function(){var doc = document;var body = doc.body;body.onselectstart = body.oncopy = body.onpaste = body.onkeydown = doc.onselectstart = doc.oncopy = doc.onpaste = doc.onkeydown = doc.oncontextmenu = null;})();

  • 不要在doctype前输出内容

    在 doctype 前输出如注释等非空白内容会导致 IE6/8 的页面异常，比如用 margin 来设置的居中。以下代码，IE6 ~ IE8 将无法居中显示。

    <!-- Some comment here will make ie6~8 abnormal -->
<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8" />
    <title>content_before_dotype</title>
    <style type="text/css" media="screen">
        #wrap{
            margin:0 auto;
            width:800px;
            height:600px;
            background:#ccc;
        }
    </style>
</head>
<body>
    <div id="wrap">
        在doctype前输出内容（非空白符）将导致IE页面布局异常，比如用margin来实现的居中。
    </div>
</body>
</html>

  • document.write

    document.write(markup)是一个比较常用的语句，不过对它的规定其实没真正看过，直到看到有人问在jQuery的ready使用document.write的问题才令我想起去看看语言定义。

    在MDN上找到相关说明。

    向由document.open打开的文档流写入字符串。

    （更多…）

  • JS版本的迅雷、旋风和普通链接的转换

    偶尔看到个PHP版本的迅雷、快车、QQ旋风专有链接的转换，然后看了一下迅雷、快车、QQ旋风专链转换原理，再加上看到说除IE外的浏览器都已经支持base64的加密、解密，其中btoa是加密，atob是解密。一时兴起，就写了个JS版本。

    demo地址

  • NULL 与 “NULL”

    向往数据库中插入数据，其中有些项可能为空（NULL），直接的查询语句如下：

    -- content text
-- parent int
insert into msg(content, parent) values("Test message", NULL);

    不过，需要考虑的是，上面的parent不一定为空，而是根据情况判断。当需要为空时，插入到数据库中的是NULL。所以需要采用变量的方式而不是硬coding，如：

    $query = "insert into msg(content, parent) values('$content', $parent)";

    在这里折腾了好久，因为一直通不过，后来才发现在判断该插入空的时候变量的PHP代码不正确。

    # wrong
parent = NULL;
# rightparent = "NULL";

    PHP中的NULL代表的是无值（no value），而实际上数据库中需要的是“NULL”，故应赋以字符串值而不是无值。

  • make a “view source” button

    各家浏览器皆有查看源码的功能，就我用来，还是IE家的最丑，Chrome的漂亮。不过此处说的是为页面建立一个button，点击此即可显示源码，参考自此文，有所修改。

    效果如下：
    效果图
    （更多…）

  • 自定义search form

    此处说的自定义 search form，是指通过 get_search_form 来调用生成的，而不是直接 code 在所需要的地方的方法。

    其实在 Codex 中的词条 get_search_form 中有详细的说明，此处权当是简单的翻译。

    一些示例

    下面是一些内建或自定义 search form 的代码示例。

    内建的 search form

    当主题中没有 searchform.php 文件时，WordPress 将使用内建的 search form：
    （更多…）