1 <html> 2 <head> 3 <title>myHtml.html</title> 4 5 <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 6 <meta http-equiv="description" content="this is my page"> 7 <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 8 9 <!--<link rel="stylesheet" type="text/css" href="./styles.css">--> 10 <!-- 此处编写JavaScript --js --> 11 <script language="javascript"> 12 //定义函数，验证表单信息是否合法 13 function checkAll(ele){ 14 alert(ele); 15 //验证用户名不为空 16 var name = document.getElementById("id1");//得到用户名输入框对象 17 var nameValue = name.value;//得到具體的值 18 if(nameValue.length<=0){//驗證 19 // document.getElementById("div1").innerHTML="<font size='4' color='red'>用户名不能为空</font>"; 20 alert("用户名不能为空，请填写"); 21 return; 22 }else{ 23 document.getElementById("div1").innerHTML=""; 24 } 25 //驗證密碼 26 var pass = document.getElementById("id2");//得到密码输入框对象 27 var passValue = pass.value; 28 if(passValue.length < 6){ 29 // document.getElementById("div2").innerHTML="<font size='4' color='red'>密码长度不能小于6位</font>"; 30 alert("密码长度不能小于6位"); 31 return; 32 }else{ 33 document.getElementById("div2").innerHTML=""; 34 } 35 //验证邮箱 36 var email = document.getElementById("id3");//得到邮箱输入框对象 37 var emailValue = email.value; 38 if(emailValue.indexOf("@") == -1){ 39 //普通的js代码可以通过设置WebSetting实现有效 40 // document.getElementById("div3").innerHTML="<font size='4' color='red'>邮箱不包含@！</font>"; 41 alert("邮箱不包含@，请检查！");//通过webchromClient设置有效 42 return; 43 }else{ 44 document.getElementById("div3").innerHTML=""; 45 } 46 47 //输入项都符合要求，提交表单,但是做一个确认的提醒 48 if(confirm("确认提交吗？")){ 49 // document.getElementById("form1").submit(); 50 //把表单中的信息传递到android代码中,通过调用android传递过来的对象myclass 51 window.myclass.sendData(nameValue,passValue,emailValue); 52 } 53 54 } 55 56 </script> 57 58 </head> 59 60 <body> 61 <form id="form1" action="success.html"> 62 <center> 63 <table > 64 <tr align="center"><td colspan="2"><a href="http://www.baidu.com">百度</a></td></tr> 65 <tr><td>用户名：</td><td width="150"><input type="text" id="id1" name="username"/><div style="display:inline" id="div1"></div></td></tr> 66 <tr><td>密码：</td><td width="150"><input type="password" id="id2" name="userpass"/><div style="display:inline" id="div2"></div></td></tr> 67 <tr><td>邮箱：</td><td width="150"><input type="text" id="id3" name="email"/><div style="display:inline" id="div3"></div></td></tr> 68 <tr ><td align="center" colspan="2"><input type="button" onclick="checkAll('开始验证');" value="提交（app）"/></td></tr> 69 </table> 70 <center> 71 </form> 72 </body> 73 </html>
1 package com.ch.day9_webviewdemo; 2 3 import java.io.UnsupportedEncodingException; 4 import java.net.URLEncoder; 5 import java.security.spec.EncodedKeySpec; 6 7 import android.os.Bundle; 8 import android.app.Activity; 9 import android.app.AlertDialog; 10 import android.content.Context; 11 import android.content.DialogInterface; 12 import android.util.Log; 13 import android.util.Xml.Encoding; 14 import android.view.Menu; 15 import android.view.View; 16 import android.view.View.OnClickListener; 17 import android.webkit.JavascriptInterface; 18 import android.webkit.JsResult; 19 import android.webkit.WebChromeClient; 20 import android.webkit.WebSettings; 21 import android.webkit.WebView; 22 import android.webkit.WebViewClient; 23 import android.widget.Button; 24 import android.widget.ExpandableListView; 25 import android.widget.TextView; 26 import android.widget.Toast; 27 28 public class MainActivity extends Activity { 29 private Button goback; 30 private Button tj; 31 public static final String HTML_URL = "http://169.254.70.111:8080/serverof1407a/myHtml.html"; 32 33 private TextView tv; 34 private WebView wv; 35 Context mcontext; 36 37 class MyClass1{ 38 @JavascriptInterface 39 public void sendData(String name,String pass,String email){ 40 Toast.makeText(mcontext, name+","+pass+","+email, 0).show(); 41 //网络连接，发送到服务器保存，同时也可以保存到本地sqlite 42 43 44 45 //跳转到注册成功页面 46 // Intent it = new Intent(mcontext,第二个页面); 47 } 48 } 49 50 @Override 51 protected void onCreate(Bundle savedInstanceState) { 52 super.onCreate(savedInstanceState); 53 setContentView(R.layout.activity_main); 54 mcontext = this; 55 init(); 56 } 57 58 public void init(){ 59 wv = (WebView) findViewById(R.id.wv); 60 goback = (Button) findViewById(R.id.goback); 61 tj = (Button) findViewById(R.id.tj); 62 //点击 提交，通过android调用js的checkAll函数 63 tj.setOnClickListener(new OnClickListener() { 64 @Override 65 public void onClick(View v) { 66 wv.loadUrl("javascript:checkAll('android调用的验证')"); 67 } 68 }); 69 70 WebSettings setting = wv.getSettings();//获得websetting，设置一些参数 71 setting.setDefaultTextEncodingName("utf-8");//设置编码，解决乱码
72 //设置普通js有效 73 setting.setJavaScriptEnabled(true); 74 75 //第一种方式加载现成的html(两个来源：网络+本地) 76 // wv.loadUrl(HTML_URL);//加载服务器的html资源 77 wv.loadUrl("file:///android_asset/myHtml.html");//加载本地assets下的html 78 //向js中推入一个对象，供调用 79 wv.addJavascriptInterface(new MyClass1(), "myclass");
//解析数据后加载页面 80 // webView.loadData(string, "text/html;charset=utf-8", "utf-8");
81 //监听webview的url的重新定位 82 wv.setWebViewClient(new WebViewClient(){ 83 @Override 84 public boolean shouldOverrideUrlLoading(WebView view, String url) { 85 // TODO Auto-generated method stub 86 Log.i("TAG", "当前webview加载的新url:::"+url); 87 // if(url.equals("http://www.baidu.com/")){ 88 // wv.loadUrl("http://www.jd.com"); 89 // } 90 return super.shouldOverrideUrlLoading(view, url); 91 92 } 93 }); 94 //处理alert无效 95 wv.setWebChromeClient(new WebChromeClient(){ 96 //处理alert无效,当js弹出alert框的时候，会调用这个方法 97 @Override 98 public boolean onJsAlert(WebView view, String url, String message, 99 JsResult result) { 100 // TODO Auto-generated method stub 101 //用dialog对话框替代系统自带的alert弹出 102 result.cancel();//关闭系统和自带的alert警告框 103 //创建android的对话框替换 104 AlertDialog.Builder dialog = new AlertDialog.Builder(MainActivity.this); 105 dialog.setTitle("警告框").setIcon(R.drawable.ic_launcher).setMessage(message) 106 .setPositiveButton("确定", null) 107 .create().show(); 108 109 return true; 110 } 111 //处理confirm无效,当js弹出confirm框的时候，会调用这个方法 112 @Override 113 public boolean onJsConfirm(WebView view, String url, 114 String message, final JsResult result) { 115 // TODO Auto-generated method stub 116 117 //创建android的对话框替换 118 AlertDialog.Builder dialog = new AlertDialog.Builder(MainActivity.this); 119 dialog.setTitle("确认提示框").setIcon(R.drawable.ic_launcher).setMessage(message) 120 .setPositiveButton("确定", new DialogInterface.OnClickListener(){ 121 @Override 122 public void onClick(DialogInterface dialog, int which) { 123 result.confirm();//点击dailog的确认，提交系统的确认框 124 } 125 }) 126 .setNegativeButton("取消", new DialogInterface.OnClickListener(){ 127 @Override 128 public void onClick(DialogInterface dialog, int which) { 129 result.cancel();//点击dailog的取消，取消系统的确认框 130 } 131 }) 132 .create().show(); 133 return true; 134 } 135 }); 136 137 // 138 goback.setOnClickListener(new OnClickListener() { 139 @Override 140 public void onClick(View v) { 141 if(wv.canGoBack()){ 142 wv.goBack();//后退 143 // wv.goForward();//前进 144 // wv.zoomIn();//放大 145 // wv.zoomOut();//缩小 146 } 147 148 } 149 }); 150 151 152 153 // //第二种方式加载现拼写的html 154 // StringBuffer sb = new StringBuffer(); 155 // sb.append("<html><head></head><body><input type='submit' value='提交（app'/></body></html>"); 156 // wv.loadData(sb.toString(), "text/html", "utf-8"); 157 } 158 159 @Override 160 public boolean onCreateOptionsMenu(Menu menu) { 161 // Inflate the menu; this adds items to the action bar if it is present. 162 getMenuInflater().inflate(R.menu.activity_main, menu); 163 return true; 164 } 165 166 }