WebView加载HTML表单并透过javascript提交

WebView加载HTML表单并通过javascript提交

使用android的WebView控件加载HTML表单，通过javascript调用java对象提交表单，在java对象中获取表单的值：

 
import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.os.Handler; 
import android.view.View;
import android.webkit.JsResult;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.widget.Button;
import android.widget.TextView;

public class WebViewTest extends Activity {
    private WebView mWebView = null;
    private TextView txtView = null;
    private Handler mHandler = new Handler();  
    
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        mWebView = (WebView) findViewById(R.id.webView);  
        txtView = (TextView) findViewById(R.id.webViewResult);  
        
        WebSettings webSettings = mWebView.getSettings();
      //不保存密码
        webSettings.setSavePassword(false);  
      //不保存表单数据
        webSettings.setSaveFormData(false);  
        webSettings.setJavaScriptEnabled(true); 
      //不支持页面放大功能
        webSettings.setSupportZoom(false); 
        
        mWebView.addJavascriptInterface(new LoginJavaScriptImpl(), "loginImpl");
        mWebView.setWebChromeClient(new MyAndroidWebClient());
        ((Button)findViewById(R.id.btnLoadhtml)).setOnClickListener(new View.OnClickListener() {
            public void onClick(View arg0) {
                mWebView.loadData(createWebForm(), "text/html", "UTF-8");
                // mWebView.loadDataWithBaseURL("", createWebForm(), "text/html", "UTF-8", "");
            }
        });
    }
     
    private String returnValue;
    protected final class LoginJavaScriptImpl { 
        public void login(String username, String password){
            returnValue = username + ": " + password; 
             
            mHandler.post(new Runnable() { 
                public void run() {
                    txtView.setText(returnValue);
                }
            }); 
        }
    }
    
    private final class MyAndroidWebClient extends WebChromeClient {
        @Override
        public boolean onJsAlert(WebView view, String url, String message,
                JsResult result) {
            new AlertDialog.Builder(WebViewTest.this)
                    .setTitle("提示信息")
                    .setMessage(message)
                    .setPositiveButton("确定",
                            new DialogInterface.OnClickListener() {
                                public void onClick(
                                        DialogInterface dialoginterface, int i) {
                                }
                            }).show();

            return true;
        }
    }
    
    private String createWebForm(){
        StringBuffer sb = new StringBuffer();
        sb.append("<html>").append("<head>");
        sb.append("<meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\"/>");
        sb.append("<title>").append("表单测试").append("</title>");
        sb.append("</head><script language=\"javascript\">");
        sb.append("function checkform(){var username=document.loginForm.username.value;");
        sb.append("var password=document.loginForm.password.value;");
        sb.append("if(username==\"\"){alert(\"用户名不能为空！\"); return false;}");
        sb.append("if(password==\"\"){alert(\"密码不能为空！\"); return false;}");
        //sb.append("return username + \":\" + password;"); 
        sb.append("window.loginImpl.login(username, password)");
        sb.append("}");
        sb.append("</script>");
        sb.append("<body>");
        sb.append("<form method=\"post\" name=\"loginForm\">");
        sb.append("<table>");
        
        sb.append("<tr>");
        sb.append("<td align=\"right\">").append("用户名").append("</td>");
        sb.append("<td").append("<input type=\"text\" name=\"username\">").append("</td>"); 
        sb.append("</tr>");

        sb.append("<tr>");
        sb.append("<td align=\"right\">").append("密    码").append("</td>");
        sb.append("<td").append("<input type=\"password\" name=\"password\">").append("</td>"); 
        sb.append("</tr>");
        
        sb.append("<tr>");
        sb.append("<td align=\"center\" colspan=\"2\">");
        sb.append("<input type=\"submit\" value=\"登录\" onclick=\"checkform();\">");
        sb.append("&nbsp;&nbsp;<input type=\"reset\" value=\"重置\">").append("</td>"); 
        sb.append("</tr>");
        
        sb.append("</table>");
        sb.append("</form>");
        sb.append("</body>");
        sb.append("</html>");
        
        return sb.toString();
    } 
}

在手机模拟器加载的表单页面：

在创建的HTML页面代码的javascript代码中，有window.loginImpl.login(username, password)用来提交表单传递参数。其中loginImpl为java代码中自定义的接口的名称：

mWebView.addJavascriptInterface(new LoginJavaScriptImpl(), "loginImpl");

MyAndroidWebClient类这里的作用主要是用来显示表单校验提示信息。

----------------------------------------------------------------------

初学，才知道LogCat视图中无法显示中文，刚开始不知道LogCat里无法显示中文，我还以为提交表单后后台java里获取到的汉字为乱码，感谢朋友的提醒！

WebView加载HTML表单并透过javascript提交

相关推荐