在PhoneGap應用程序中以編程方式在iPhone上顯示軟鍵盤？

Question

我一直在尋找很長很長的時間，到目前為止，我沒有遇到過可以通過編程方式顯示軟鍵盤的PhoneGap / Cordova應用程序的解決方案。

場景：

我們有一個PhoneGap應用程序 - 一個在jQuery Mobile中創建的網站 - 在某一點上顯示了一個用戶對話框。 此對話框也是一個網頁，並且只有一個INPUT文本框，用戶應在其中輸入代碼。

問題：

顯示代碼對話框時， 使用JavaScript聚焦輸入框 。 但是，由於iPhone內部瀏覽器受到限制，在用戶實際真正點擊輸入文本框之前，軟鍵盤才會出現。

我們嘗試了什么：

• 創建一個隱藏的文本框並使其成為第一響應者
• 一旦輸入通過JavaScript獲得焦點，使實際webview成為第一響應者
• 使用sendActionsForControlEvents嘗試將Touch事件傳遞給webview（雖然如果有人有PhoneGap應用程序的工作代碼，我會很感激，如果他們可以分享它，因為我不是iOS編碼的專業人士）

有任何想法嗎？

---

編輯：此問題中提到的限制僅適用於內置瀏覽器 ...如果您的目標是Opera，您將通過使用以下代碼獲得成功：

var e = jQuery.Event("keydown", { keyCode: 37 });
$('#element').focus().trigger(e);

---

EDIT2：這是一個可以在插件中使用的最終工作PhoneGap代碼：

keyboardhelper.h

//
//  keyboardHelper.h
//  soft keyboard displaying plugin for PhoneGap
//
//  Copyright 2012 Martin Ambrus.
//

#import <Foundation/Foundation.h>
#ifdef CORDOVA_FRAMEWORK
#import <Cordova/CDVPlugin.h>
#else
#import "CDVPlugin.h"
#endif

@interface keyboardHelper : CDVPlugin {
    NSString *callbackID;
}

@property (nonatomic, copy) NSString *callbackID;

- (void)showKeyboard:(NSMutableArray*)arguments withDict:(NSMutableDictionary*)options;

@end

keyboardhelper.m

//
//  keyboardHelper.m
//  soft keyboard displaying plugin for PhoneGap
//
//  Copyright 2012 Martin Ambrus.
//

#import "keyboardHelper.h"
#import "AppDelegate.h"

@implementation keyboardHelper
@synthesize callbackID;

-(void)showKeyboard:(NSMutableArray*)arguments withDict:(NSMutableDictionary*)options {
    self.callbackID = [arguments pop];

    //Get text field coordinate from webview. - You should do this after the webview gets loaded
    //myCustomDiv is a div in the html that contains the textField.
    int textFieldContainerHeightOutput = [[((AppDelegate *)[[UIApplication sharedApplication] delegate]).viewController.webView stringByEvaluatingJavaScriptFromString:@"document.getElementById(\"myCustomDiv\").offsetHeight;"] intValue];

    int textFieldContainerWidthOutput = [[((AppDelegate *)[[UIApplication sharedApplication] delegate]).viewController.webView  stringByEvaluatingJavaScriptFromString:@"document.getElementById(\"myCustomDiv\").offsetWidth;"] intValue];

    int textFieldContainerYOffset = [[((AppDelegate *)[[UIApplication sharedApplication] delegate]).viewController.webView  stringByEvaluatingJavaScriptFromString:@"document.getElementById(\"myCustomDiv\").offsetTop;"] intValue];

    int textFieldContainerXOffset = [[((AppDelegate *)[[UIApplication sharedApplication] delegate]).viewController.webView  stringByEvaluatingJavaScriptFromString:@"document.getElementById(\"myCustomDiv\").offsetLeft;"] intValue];

    UITextField *myTextField = [[UITextField alloc] initWithFrame: CGRectMake(textFieldContainerXOffset, textFieldContainerYOffset, textFieldContainerWidthOutput, textFieldContainerHeightOutput)];

    [((AppDelegate *)[[UIApplication sharedApplication] delegate]).viewController.webView addSubview:myTextField];
    myTextField.delegate = self;

    CDVPluginResult* pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK messageAsString: @"ok"];

    [self writeJavascript:[pluginResult toSuccessCallbackString:self.callbackID]];
}

-(BOOL)textFieldShouldReturn:(UITextField *)textField
{
//here you create your request to the server
return NO;
}

-(BOOL)textFieldDidEndEditing:(UITextField *)textField
{
//here you create your request to the server
return NO;
}

@end

JavaScript的

var keyboardHelper = {
    showKeyboard: function(types, success, fail) {
        return Cordova.exec(success, fail, "keyboardHelper", "showKeyboard", types);
    }
};

Answer 1

您現在可以使用config.xml條目解決問題，添加：

<preference name="keyboardDisplayRequiresUserAction" value="false" />

Answer 2

您可以使用webView上的javascript獲取輸入字段的坐標。 然后，將您自己的textField放在它的頂部，並在其委托方法textFieldShouldReturn中向服務器發送一個請求，其中包含用戶輸入的代碼。

    //Get text field coordinate from webview. - You should do this after the webview gets loaded
    //myCustomDiv is a div in the html that contains the textField.
int textFieldContainerHeightOutput = [[webView stringByEvaluatingJavaScriptFromString:@"document.getElementById(\"myCustomDiv\").offsetHeight;"] intValue];

int textFieldContainerWidthOutput = [[webView stringByEvaluatingJavaScriptFromString:@"document.getElementById(\"myCustomDiv\").offsetWidth;"] intValue];

int textFieldContainerYOffset = [[webView stringByEvaluatingJavaScriptFromString:@"document.getElementById(\"myCustomDiv\").offsetTop;"] intValue];

int textFieldContainerXOffset = [[webView stringByEvaluatingJavaScriptFromString:@"document.getElementById(\"myCustomDiv\").offsetLeft;"] intValue];

myTextField.frame = CGRectMake(textFieldContainerXOffset, textFieldContainerYOffset, textFieldContainerWidthOutput, textFieldContainerHeightOutput);
[webView addSubview:myTextField];
myTextField.delegate = self;

然后實現textFieldShouldReturn並在那里向服務器創建請求。

-(BOOL)textFieldShouldReturn:(UITextField *)textField
{
//here you create your request to the server
return NO;
}

這是在現有項目中完成的，但不使用PhoneGap。 我希望你能適應它，以滿足你的需求。

要刪除文本字段，可以隱藏它

myTextField.hidden = YES;

要么

myTextField = nil;

要么

[myTextField removeFromSuperView];

Answer 3

在iOS 6之前，Apple只允許在用戶交互后調出鍵盤。 在iOS 6中，他們為UIWebView引入了以下屬性，您只需將其設置為NO即可。

    "yourWebView".keyboardDisplayRequiresUserAction = NO;

Apple默認將此設置為“是”。 現在你可以在JS中調用focus()並顯示鍵盤。

Answer 4

您是否嘗試過使用Native Controls並從Javascript中調用它們？

這里有一些代碼，顯示Phonegap Cordova應用程序上的Native Controls的使用情況（Phonegap 1.5）

https://gist.github.com/1384250

希望它有助於解決問題:)

Answer 5

我承認這是私人的，但它可能會幫助你：

@class UIKeyboard;

void showKeyboard()
{
    static UIKeyboard *kb = nil;
    if ([[UIKeyboard class] respondsToSelector:@selector(automaticKeyboard)])
        kb = [UIKeyboard automaticKeyboard];
    else
        kb = [UIKeyboard activeKeyboard];

    if (kb == nil) {
        kb = [[[UIKeyboard alloc] initWithDefaultSize] autorelease];
        [[[UIApplication sharedApplication] keyWindow] addSubview:kb];
    }

    if ([kb respondsToSelector:@selector(orderInWithAnimation:)]) {
        [kb orderInWithAnimation:YES];
    } else {
        [kb activate];
        [kb minimize];
        [kb maximize];
    }
}

並稱之為：

showKeyboard();

Answer 6

我實際上剛剛找到了解決方案 。 像霍拉克說和這篇文章中描述 ，有或沒有軟鍵盤，它現在可以與iOS 6.0通過實現這一點：KeyboardDisplayRequiresUserAction = NO;

從Cordova 2.2開始，上面提到的iOS屬性可以簡單地添加到Cordova.plist文件中：

KeyboardDisplayRequiresUserAction, boolean, NO

這解決了所有使用Cordova 2.2的人。 現在只需調用input.focus（） ，如前所述，鍵盤將自動出現。 對於我們這些尚未將Cordova更新到當前最新版本（2.2）的人來說，幸運的是仍然可行 。

使用cordova v。<2.2以編程方式在iPhone上顯示鍵盤

第1步 ： 向Cordova.plist添加屬性

轉到您的項目> Resources> Cordova.plist。 添加：KeyboardDisplayRequiresUserAction，boolean，NO

第2步 ： 將下面的代碼片段添加到CDVViewController.m

搜索 “@interface CDVViewController”（或類似於找到上面的文件）。 對於Cordova 2.1，請轉到第240行 （其他人在“ IsAtLeastiOSVersion ”if語句之后轉到一行，抱歉不能比這更精確。）在上面提到的行上將此代碼片段添加到CDVViewController.m：

if (IsAtLeastiOSVersion(@"6.0")) {
    BOOL keyboardDisplayRequiresUserAction = YES; // KeyboardDisplayRequiresUserAction - defaults to YES
    if ([self.settings objectForKey:@"KeyboardDisplayRequiresUserAction"] != nil) {
        if ([self.settings objectForKey:@"KeyboardDisplayRequiresUserAction"]) {
            keyboardDisplayRequiresUserAction = [(NSNumber*)[self.settings objectForKey:@"KeyboardDisplayRequiresUserAction"] boolValue]; //JB-VAL121212
        }
    }

    // property check for compiling under iOS < 6
    if ([self.webView respondsToSelector:@selector(setKeyboardDisplayRequiresUserAction:)]) {
        [self.webView setValue:[NSNumber numberWithBool:keyboardDisplayRequiresUserAction] forKey:@"keyboardDisplayRequiresUserAction"];
    }

}

免責聲明 ： 這僅在Cordova 2.1上進行了測試，但它很可能仍然適用於2.0或CDVViewController.m文件附帶的任何其他早期版本）

Answer 7

您可以在輸入字段上使用FocusOut事件，並在按下完成鍵時觸發此事件。 我可以在IOS 6及更高版本上使用它。 我相信它也適用於以前的版本。