javascript - Android WebView - 使用 Javascript 设置 HTML 字段焦点

标签 javascript android android-webview dom-events setfocus

我有一个只有一个可见的 WebView 组件的应用程序,它用于显示一些动态生成的 HTML(也可以运行 Javascript)。它为 WebView 启用。

对于一些页面,我试图在页面加载完成后设置其中一个输入文本框的焦点 - 不是通过 Body onLoad(),但是而不是在页面完成加载后通过 JS 调用,即在 onPageFinished() 中。大多数 javascript 执行良好

    webview.loadURL("javascript:JSMethod();");

但是当我使用相同的调用来执行 document.getElementById('text1').focus() 时 - 光标到达元素但软键盘不会弹出。从页面上的按钮执行相同的 javascript 代码确实具有预期的效果。

我附上有3个按钮

的源代码
  1. Focus Text1 - 将光标放在 text1 上并弹出软键盘。
  2. Java Focus Text1 - 调用 Java 来执行相同的 JS。只在那里显示光标,不弹出键盘
  3. Java Focus Text1 和键盘打开 - 从 Java 调用 JS 并强制打开键盘。

我的理解是,无论是使用按钮/事件从浏览器执行,还是通过 WebView.loadURL() 从 Java 发送,JS 执行都应该是一样的。

这是我的查询

  1. 我在使用 Button#2 时是否遗漏了什么?这就是我当前的代码,我只看到光标已设置,但 SoftKeyboard 打不开。
  2. 当我使用 Button#3 中编写的逻辑时,有时我在字段上看不到光标,但会给我想要的效果,当我在弹出键盘。
  3. 我在 Button#2 中看到的行为会不会是 Android JS 执行中的错误?或者可能是 WebView 没有焦点,这就是为什么只显示光标的原因?我还尝试了 webview.requestFocus() - 我无法编写 requestFocusOnTouch(),因为它是我拥有的唯一 View ,我希望它自动聚焦。

演示该行为的 Java 代码是

    import android.app.Activity;
    import android.content.Context;
    import android.os.Bundle;
    import android.util.Log;
    import android.view.inputmethod.InputMethodManager;
    import android.webkit.JsResult;
    import android.webkit.WebChromeClient;
    import android.webkit.WebView;
    import android.webkit.WebViewClient;

    public class WebViewProjectTestJSHTMLFocusActivity extends Activity {

        Activity _current = null;
        WebView wv = null;

        /** Called when the activity is first created. */
        @Override
        public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            _current = this;
            //setContentView(R.layout.main);
            String data = "<html><body>" +
                                "<script>function focusser() { document.getElementById(\"text1\").focus(); } </script>" +
                                "<script>function javaFocusser() { javautil.javaFocus(false); } </script>" +
                                "<script>function javaFocusserKeyboard() { javautil.javaFocus(true); } </script>" +
                                "Text 1<input type='text' id='text1'/><br/>" +
                                "Text 2<input type='text' id='text2'/><br/>" +
                                "<input type='button' value='Focus Text1' onClick='focusser()'/>" +
                                "<input type='button' value='Java Focus Text1' onClick='javaFocusser()'/>" +
                                "<input type='button' value='Java Focus Text1 And Keyboard Open' onClick='javaFocusserKeyboard()'/>" +
                            "</body></html>";
            wv = new WebView(this);
            wv.getSettings().setJavaScriptEnabled(true);

            // Set some HTML 
            wv.loadDataWithBaseURL("file:///android_asset/", data, "text/html", "UTF-8", null);

            // Call back required after page load finished
            wv.setWebViewClient(new CustomWebViewClient());

            // Enable Alert calls  
            wv.setWebChromeClient(new CustomWebChromeClient());

            // For JS->Java calls
            wv.addJavascriptInterface(this, "javautil");

            setContentView(wv);
        }


        /**
         * Calls the same javascript and forces the keyboard to open 
         */
        public void javaFocus(final boolean shouldForceOpenKeyboard) {

            Thread t = new Thread("Java focusser thread") {
                public void run() {
                    wv.loadUrl("javascript:focusser();");
                    if(shouldForceOpenKeyboard) {
                        InputMethodManager mgr = (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE);
                        mgr.showSoftInput(wv, InputMethodManager.SHOW_IMPLICIT);
                    }
                }
            };

            // Run on the View Thread.
            _current.runOnUiThread(t);
        }

        /**
         * Calls focus method after the page load is complete.
         */
        final class CustomWebViewClient
        extends WebViewClient {
            @Override
            public void onPageFinished(WebView view, String url) {
                // javaFocus(true);
                Log.d("TestExamples", "focusser call complete");
            }
        }

        final class CustomWebChromeClient
        extends WebChromeClient {
            @Override
            public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
                Log.d("TestExamples", "JS Alert :: " + message);
                return false;
            }
        }
    }

解决方案更新 24-06-2011 为了使这项工作有效,您需要在实际的 JS 焦点调用之前使用 wv.requestFocus(View.FOCUS_DOWN)。我将上面的 javaFocus() 方法修改为下面的正确版本。早些时候当我提到我正在使用 requestFocus() 时,我在 onCreate() 方法中初始化 WebView 时使用它。主要区别是现在我们强制 WebView 每次在执行 Javascript document.getElementById("text1").focus(); 之前获得焦点。

public void javaFocus(final boolean shouldForceOpenKeyboard) {
    Thread t = new Thread("Java focusser thread") {
        public void run() {
            wv.requestFocus(View.FOCUS_DOWN);
            wv.loadUrl("javascript:focusser();");
            if(shouldForceOpenKeyboard) {
                InputMethodManager mgr = (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE);
                mgr.showSoftInput(wv, InputMethodManager.SHOW_IMPLICIT);
            }
        }
    };

    // Run on the View Thread.
    _current.runOnUiThread(t);
}

另外,为了确保此问题未因通过触摸等触发焦点而得到修复,我使用后台线程在 WebView 显示 5 秒后启动 javaFocus()。修改后的 onCreate() 如下。

..... More onCreate code before....
// Enable Alert calls  
wv.setWebChromeClient(new CustomWebChromeClient());

// For JS->Java calls
wv.addJavascriptInterface(this, "javautil");

setContentView(wv);

new Thread("After sometime Focus") {
    public void run() {
        try {
            Thread.sleep(5000);
        } catch (InterruptedException e) {
            e.printStackTrace();
        }
        javaFocus(true);
    }
}.start();
.... onCreate() ends after this.... 

最佳答案

可能是 webview 没有应用程序焦点。尝试执行;

wv.requestFocus(View.FOCUS_DOWN);

关于javascript - Android WebView - 使用 Javascript 设置 HTML 字段焦点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5662828/

相关文章:

javascript - Eloquent JavaScript : Higher Order Functions

javascript - 使用外部 API 和 Salesforce 自动完成字段

android - 使用后端服务器进行身份验证的正确方法

android - 如何设置背景不被拉伸(stretch)?

除非在浏览器中打开,否则 Android webview 不会加载

Javascript 等待/异步功能 - 如果函数中没有等待字怎么办?

javascript - 如何使用 Chart.js 创建 y 轴为 0 到 100 的雷达图?

java - Android Recycler View "onBindViewHolder"函数 "static method cannot be called from non-static method"中的问题

android - 在 Android 应用程序中嵌入 Youtube 视频

java - 为什么我的应用程序在启动时崩溃?