Javascript 卡布奇诺：键盘事件在reCAPTCHA输入字段中被挤压

我正在将reCAPTCHA集成到我的卡布奇诺应用程序中，除了reCAPTCHA输入文本字段中的这个奇怪的输入功能外，我的所有功能都正常工作：只有一些键似乎正常工作，“qwrszcv”和一些其他字母正常工作，但大多数其他键都不工作

我借用了一些mapkit代码，将reCAPTCHA脚本文件注入头部，然后将reCAPTCHA div注入到我创建的自定义CPView类中

这是我的构造函数代码：

- (id)initWithFrame:(CGRect)aFrame
{

    self = [super initWithFrame:aFrame];
    if (self != nil)
    {
        var DOMScriptElement = document.createElement("script");

        DOMScriptElement.src = "http://www.google.com/recaptcha/api/js/recaptcha_ajax.js";
        DOMScriptElement.type = "text/javascript";

        document.getElementsByTagName("head")[0].appendChild(DOMScriptElement);

        needsInitialization = YES;
        console.log(self);
    }
    return self;

}

和我的初始化代码：

- (id)initializeRecaptcha
{
    if (needsInitialization)
    {
        DOMRecaptchaElement = document.createElement("div");
        DOMRecaptchaElement.id = "recaptcha_div_id";


        var style = DOMRecaptchaElement.style,
            bounds = [self bounds],
            width = CGRectGetWidth(bounds),
            height = CGRectGetHeight(bounds);

        style.overflow = "hidden";
        style.position = "absolute";
        style.visibility = "visible";
        style.zIndex = 0;
        style.left = "0px";
        style.top = "0px";
        style.width = width + "px";
        style.height = height + "px";

        _DOMElement.appendChild(DOMRecaptchaElement);

        window.Recaptcha.create("my-recaptcha-key",
            "recaptcha_div_id",
            {
                theme: "clean",
                callback: window.Recaptcha.focus_response_field
            }
        );

        needsInitialization = NO;
    }
    else
    {
        window.Recaptcha.reload();
    }
}

---

我认为这与卡布奇诺传播事件的方式有关，但就我的一生而言，我无法找到一种方法来让这些输入发挥作用。

卡布奇诺在文档级别附加关键事件侦听器，以便处理键盘快捷键。我不知道为什么有些角色能通过，而有些角色不能，但如果它与潜在的卡布奇诺键盘快捷键相对应，我也不会感到惊讶。您可能需要检查

CPPlatformWindow+DOM.j

以了解有关此操作的更多详细信息

---

同时，解决实际问题的一个简单方法是将整个recaptcha小部件放到一个iframe中（您可以使用

CPWebView

或自己制作）。请记住，在iFrame内部的事件处理程序中，您可能必须使用

[[cprunlop currentlunloop]limitDateForMode:CPDefaultRunLoopMode]手动泵送事件队列

在对运行循环之外的代码进行更改后，让Cappuccino重新显示。

我找到了一个修复方法。我从CPTextField中的keyDown方法复制了代码，该方法将事件传播到浏览器窗口，并将代码复制到我的自定义视图中的keyDown方法，该自定义视图中包含以下内容：

- (void)keyDown:(CPEvent)anEvent
{
    [[[self window] platformWindow] _propagateCurrentDOMEvent:YES];
    [self interpretKeyEvents:[anEvent]];
    [[CPRunLoop currentRunLoop] limitDateForMode:CPDefaultRunLoopMode];
}

---

是的，我在考虑使用CPWebView，只是觉得iframe可能会增加不必要的复杂性。如果不在卡布奇诺中使用iframe，真的没有办法拥有一个自定义输入字段吗？很可能有一种方法可以做到这一点。只是不确定这样做是否值得——iframe没有那么贵。但是如果您真的想添加它，您应该在Javascript调试器中设置一些调试点，并使用

index debug.html

加载应用程序的调试版本。然后从

CPPlatformWindow+DOM.j

向下跟踪事件处理，以查找有效键和无效键。