HTML INPUT 自动关闭输入法

May 1st, 2009 | Filed under JavaScript

Form 表单中常有很多输入框仅仅需要输入数字或者英文等,比如电话号码,商品条码等等,当用户在这些文本框中输入信息时,自动关闭输入法确实比较贴心。我的一个台湾客户称之为“阿呆功能”,想想确实蛮傻瓜的,因为现在很多输入法(比如 Google 拼音),回车就可以直接输入数字或者英文。

但是所有的软件都有其的固定客户使用群,而你所开发的软件的使用者都是白痴也说不定的,他们或许根本不知道世界上有 Google 拼音的存在,很大一种情况就是他们可能还在使用着系统自带的古董——智能 ABC。在这种情况,所谓的“阿呆功能”还是有其存在的价值的。

实现的方法也很简单,如下:

1
<input name="input" style="ime-mode:disabled" />

作为一个敲代码的,您不能低估客户的淫荡程度,比如我现在手里的项目,几乎全是表单,几百个文本框,客户要求所有的表单都要如此“智能” :roll:

My God,我当然不可能也不愿意去找到这些需要处理的文本框,然后都插进这个 style,而且没人喜欢做这种重复性的工作。

这时候使用 JS 就可以解脱了。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// 将需要关闭输入法的 Input 文本框的 Id 值放进这个数组中
var names =[
    'age',
    'email',
    'web',
    'phone',
    'skype'
];
 
window.addEvent('domready', function () {
    $(document.body).getElements('input').each(function(element) {
        if (element.type == "text") {
            if (names.contains(element.name)) {
                var styles = element.getStyles();
                styles['ime-mode'] = 'disabled';
                element.setStyles(styles);
            }
        }
    });
});

最后只需要配置 JS 中的数组就可以了,把需要关闭输入法的文本框 id 统统放进去。
你也可以此基础上实现更多的功能,比如禁止复制粘贴之类的。

  1. Rainux
    May 1st, 2009 at 16:52
    Reply | Quote | #1

    MooTools 似乎还是没有 jQuery 简洁啊。

  2. Verdana Mu
    May 2nd, 2009 at 00:25
    Reply | Quote | #2

    @Rainux
    jQuery 的设计追求的就是简洁和高效,很适合快速开发,这方面 Mootools 要弱一些,比如 Ajax,DOM Selector 就不是太好用。

  3. 华晨
    Aug 23rd, 2009 at 12:49
    Reply | Quote | #3

    在chrome下不能实现

  4. Verdana Mu
    Aug 28th, 2009 at 16:51
    Reply | Quote | #4

    Chrome, Safari, Opera…

Comments are closed.