jquery mobile - 移动设备上的keyup keydown

Posted

技术标签:

【中文标题】jquery mobile - 移动设备上的keyup keydown【英文标题】:jquery mobile - keyup keydown on mobile devices 【发布时间】:2014-02-02 11:36:03 【问题描述】:

我需要输入 (type='text') 以将结果发送到我的服务器,以检查用户键入的内容的可用性。

我使用委托将事件处理程序添加到元素:

$(document).delegate('#signup', 'pageshow', function() 
    var keydown = function(e) 
        e = e || window.event;
        var char = e.which || e.keyCode;
        if (char == 8) 
            $(".pagemessage").text("Pressed: '<BACKSPACE>'");
            appcheckDomainOnKeyDown();
        
        return true;
    ;

    var keyup = function(e) 
        e = e || window.event;
        var char = e.which || e.keyCode;
        if (char == 8) 
            appcheckDomainOnKeyUp();
        
        return true;
    ;

    var keypress = function(e) 
        e = e || window.event;
        var char = e.which || e.keyCode;
        var str = String.fromCharCode(char);
        $(".pagemessage").text("Pressed: '" + str +"'");
        if (/[a-zA-Z0-9-\._]/.test(str) || char == 8 || char == 9) 
            appcheckDomainOnKeyDown();
            appcheckDomainOnKeyUp();
            return true;
        
        return false;
    ;

密钥处理程序在我的桌面上完美运行,但在移动设备上却不行。希望您能看到我正在尝试允许某些字符进入框中(以及用于删除字符的退格键。

从我看不到 pagemessage 元素更新的事实来看,'keypress' 似乎没有被困住。我尝试在 keyup/keydown 中处理此问题,但我不确定如何应用 shiftKey 位来按下实际字符 - 例如按 + 5 将给出“%”,但在 keydown 中它返回 shiftKey 和 5。

我阅读了文档,发现最接近“按键”的是“点击”事件,但这也不起作用。

我已尝试按照此处的一篇文章中的建议捕获“按键”事件,在桌面上这不会捕获退格,在移动设备上什么也不做。

然后我按照另一篇文章中的建议尝试了这个:

    var inputEV = 'oninput' in window ? 'input' : 'keyup';
    $("#new_domain").off(inputEV);
    $("#new_domain").on(inputEV, function (e) 
        keydown(e);
        keyup(e);
    );

它在桌面浏览器或移动设备上都不起作用。

然后我尝试将输入类型更改为“搜索”,我得到了一个相当不错的增强功能,即按键确实添加了一个清除按钮...但在移动设备上对我自己的功能没有任何作用。

我想我已经用完了可以尝试的东西,唯一剩下的就是添加一个按钮来检查 - 没有人想要那个:)

有人知道我怎样才能做我需要的吗?

如果相关,我在我的桌面和安卓设备(HTC 1 和 Nexus 5)上使用 chrome

【问题讨论】:

【参考方案1】:

Keyup 应该可以工作。它适用于这个例子:http://jsbin.com/aNEBIKA/2/。在我的 Galaxy S3 上经过测试发现。每次按键都会使用输入的文本更新页脚h3 元素。

会不会是你在错误的时间绑定了你的听众?文档确实建议像这样绑定:

$(document).bind('pageinit')

http://demos.jquerymobile.com/1.2.0/docs/api/events.html

【讨论】:

我刚刚更新了应用程序以将内容打印到 div 并且似乎 (e.which || e.keyCode) 在我的设备上始终为零。还有什么其他选择。我的问题似乎源于不想允许某些字符。 'keypress' 不受支持,但在正确的位置...我可能必须添加一个 keyup 触发器来检查输入框的最后一个值,如果它无效则将其删除...虽然用户会看到:(

以上是关于jquery mobile - 移动设备上的keyup keydown的主要内容,如果未能解决你的问题,请参考以下文章

更改设备方向上的图像 jquery-mobile

jQuery Mobile 快速入门

jquery mobile ui无法在移动设备上运行

在哪里存储我的密钥以加密移动设备上的数据?

适用于桌面和移动设备的 jQuery Mobile

Jquery mobile getJSON 适用于浏览器但不适用于移动设备