使用 InAppBrowser 加载页面和微调器加载后无法输入输入字段

Posted

技术标签:

【中文标题】使用 InAppBrowser 加载页面和微调器加载后无法输入输入字段【英文标题】:Can't type in input field after loading a page with InAppBrowser and spinner loading 【发布时间】:2017-06-28 22:25:51 【问题描述】:

我遇到了一个非常有趣的问题。我在我的一个 android 应用程序中使用 inAppBrowser 和微调器。 Spinner 使用ProgressDialog 实现。这里的问题是,当我尝试通过 inAppBrowser 打开网页并且加载微调器在页面开始加载后开始加载,然后在完成加载页面后关闭时,当我点击该页面的输入字段并尝试键入字母或数字,它只是停留在所谓的“锁定”状态。如果我输入一些我看不到的内容,光标就会一直闪烁。

为了让这更奇怪,我可以输入特殊字符。如果我点击页面周围的任何其他位置,然后再次点击相同的输入字段,它就会起作用。另一种有效的情况是,当我将应用程序置于暂停状态然后恢复时,输入字段有效。

此问题仅在 Android 5.0.1 及更早版本的平台上出现。

inAppBrowser java 文件可以在 Github InAppBrowser java file 找到。

我的微调器实现如下:

spinner = new ProgressDialog(cordova.getActivity());
spinner.setIndeterminate(false);
spinner.setProgressStyle(ProgressDialog.STYLE_SPINNER);
spinner.setCancelable(false);
spinner.setMessage(cordova.getActivity().getText(R.string.spinner_loading));
spinner.setTitle("");

我通过以下方式显示/隐藏微调器:

@Override
public void onPageStarted(WebView view, String url,  Bitmap favicon) 
    super.onPageStarted(view, url, favicon);
    //InAppBrowser default code....

    try 
        JSONObject obj = new JSONObject();
        obj.put("type", LOAD_START_EVENT);
        obj.put("url", newloc);

        sendUpdate(obj, true);

     catch (JSONException ex) 
        Log.d(LOG_TAG, "Should never happen");
    

    spinner.show();


public void onPageFinished(WebView view, String url) 
    super.onPageFinished(view, url);
    try 
        JSONObject obj = new JSONObject();
        obj.put("type", LOAD_STOP_EVENT);
        obj.put("url", url);

        sendUpdate(obj, true);

     catch (JSONException ex) 
         Log.d(LOG_TAG, "Should never happen");
    

    spinner.hide();

这可能是什么问题?任何提示,建议将不胜感激。

【问题讨论】:

你能用chrome检查器调试设备中的应用程序,并检查控制台是否有任何错误吗? @Gandhi:我已经修好了,谢谢你的评论。 【参考方案1】:

现在我能够解决问题。问题是该特定页面输入字段的焦点。由于某种原因,一旦页面完成加载,它就没有将焦点放在自身上。

尝试通过使用editText.clearFocus()editText.requestFocus() 来解决inAppBrowser 的inAppBrowser.java 文件中的问题根本没有帮助。但对我有用的是遵循解决方案。

由于 inAppBrowser 有一个名为 executeScript() 的方法,我能够将一些 javascript 代码注入到存在此问题的特定输入字段中。因此,以下代码可以解决问题:

var ref = cordova.InAppBrowser.open('http://apache.org', '_blank',  location=yes');
ref.addEventListener('loadstop', function() 
    ref.executeScript(code: "$('#element').blur(); $('#element').focus();");
);

该代码的作用是首先清除该特定元素的焦点,然后再次关注同一元素。

这可以在任何平台上运行,无论版本如何。

【讨论】:

嗨,您是如何关注 url 的?它在 ionic 3 中对我不起作用,我需要专注于 url,以便我可以输入新的 url 并像正常浏览器一样浏览可以帮助我浏览多个网站。我可以这样做吗?【参考方案2】:

如果有人像我一样遇到这个问题,请尝试将 InAppBrowser 插件更新到最新版本(1.7.2)。

ionic cordova plugin rm cordova-plugin-inappbrowser --save
ionic cordova plugin add cordova-plugin-inappbrowser --save

1.7.2版本有这个fix

我正在使用 Ionic (v3)。

【讨论】:

以上是关于使用 InAppBrowser 加载页面和微调器加载后无法输入输入字段的主要内容,如果未能解决你的问题,请参考以下文章

Cordova InAppBrowser 隐藏,直到完成加载

使用微调器加载 jQuery 整个 HTML 页面

在 jQuery Mobile 中的 Ajax 调用中显示页面加载微调器

Cordova InAppBrowser 隐藏时速度较慢

带有加载微调器的 jQuery 验证

当页面数据未从 Firebase 完全加载时显示加载指示器/微调器 - Flutter