web-dev-qa-db-ja.com

Android WebViewのjavascriptを介してHTMLボタンのクリックを検出

私はjavascriptにあまり詳しくありませんが、これが私の目的を達成するための最良の方法だと思います。そうでない場合は、修正してください。

最後にライセンステキスト2つのボタンがあります。ライセンスにはいくつかのリンクがあるため、これらはすべてWebViewのHTMLで記述されています。ここで、ユーザーがWebViewの[ok]ボタンをクリックすると、これがJavaで起動してIntentを使用してアプリケーションを先に進めます(キャンセルボタンは反対の操作を行いますが、一方の方法を知っていれば、もう一方の操作を行うことができます;))

これは誰かに鐘を鳴らしますか?どんな説明やサンプルコードも歓迎します。

37
Sephy

読んだ後、ついに自分で手に入れました。 javascriptについて何も知らない場合や、ドキュメントの主題が非常に薄い場合は、ちょっと大変です。
これが私の解決策です。これが他の人に役立つことを願っています:

そのような最後に2つのボタンを含むHTMLページで:

<div>
     <button type="button" id="ok" style="font-weight: 700; margin-right: 20px;" onclick="validClick();">J'accepte</button>
     <button type="button" id="no" onclick="refuseClick();">Je refuse</button>
</div>

クリックのイベントをHTMLページの上部にあるjavascriptに送信します。

<script language="javascript">

   function validClick()
   {
      valid.performClick();
      document.getElementById("ok").value = "J'accepte";
   }
   function refuseClick()
   {
      refuse.performClick();
      document.getElementById("no").value = "Je refuse";
   }

</script>

validrefuseは2 Javaメソッドを使用するためにJavaScriptインターフェイスを介して渡したオブジェクトです。Javaでは、実際には表示されない2つのボタンを作成しましたアクティビティでは、メソッドについてのみここにあり、HTMLボタンの影のようなものです:

valid = new Button(ctx);
valid.setOnClickListener(this);
refuse = new Button(ctx);
refuse.setOnClickListener(this);

次に、WebViewにjavascriptを追加しました。

// Enablejavascript
WebSettings ws = wv.getSettings();
ws.setJavaScriptEnabled(true);
// Add the interface to record javascript events
wv.addJavascriptInterface(valid, "valid");
wv.addJavascriptInterface(refuse, "refuse");

最後に、onClickメソッドでクリックイベントを処理します。

@Override
public void onClick(View v) {
    if (v.equals(valid)) {
        //do Something
    } else if (v.equals(refuse)) {
        //do Something else }
}

これが一部の人々に役立つことを願っています

60
Sephy

より簡単なソリューションを次に示します。 Java側で、ボタンごとにリスナーを作成します。メソッドはリフレクションを使用して検索されるため、特定のクラスである必要はありません。

WebSettings ws = wv.getSettings();
ws.setJavaScriptEnabled(true);
wv.addJavascriptInterface(new Object()
{
  public void performClick()
  {
    // Deal with a click on the OK button
  }
}, "ok");

次に、HTMLで、ボタンタグから直接呼び出します。

<button type="button" onclick="ok.performClick();">OK</button>
40
peastman

ボタンの値も取得したい場合。

Java:

WebSettings ws = wv.getSettings();
ws.setJavaScriptEnabled(true);
wv.addJavascriptInterface(new Object()
{
   @JavascriptInterface           // For API 17+
   public void performClick(String strl)
   {
      stringVariable = strl;
      Toast.makeText (YourActivity.this, stringVariable, Toast.LENGTH_SHORT).show();
   }
}, "ok");

HTML:

<button type="button" value="someValue" onclick="ok.performClick(this.value);">OK</button>
21
user2999943
    WebView browser = new WebView(this);
    browser.getSettings().setJavaScriptEnabled(true);
    browser.loadUrl("file:///Android_asset/page.html");
    setContentView(browser);
    WebSettings ws = browser.getSettings();
    ws.setJavaScriptEnabled(true);
    browser.addJavascriptInterface(new Object()
    {
        @JavascriptInterface           // For API 17+
        public void performClick(String strl)
        {

            Toast.makeText (MainActivity.this, strl, Toast.LENGTH_SHORT).show();

        }
    }, "ok");

page.htmlファイル

<html>
<body>

    First name: <input type="text" name="fname" id="txtfname"><br>
    Last name: <input type="text" name="lname" id="txtlname"><br>

    <script>
    function getValues() {
    document.getElementById("btnOK").value = document.getElementById("txtfname").value+" "+document.getElementById("txtlname").value;
    }
    </script>

    <button type="button" value="" id="btnOK" onclick="getValues();ok.performClick(this.value);">OK</button>
</body>
</html>
2
Raviraj Desai