webview加载h5页面,怎么响应h5中的按钮的ih5点击按钮跳转页面

在 SegmentFault,解决技术问题
每个月,我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。
一线的工程师、著名开源项目的作者们,都在这里:
获取验证码
已有账号?
问题对人有帮助,内容完整,我也想知道答案
问题没有实际价值,缺少关键内容,没有改进余地
安卓应用中几个H5页面中的跳转问题,在一个H5页面中,点击安卓按钮的返回键,返回上一个H5页面,但是不会刷新上个H5页面,现在需要刷新上一个H5页面。我用的如下的方法。求大神指点 @Override
public void onBackPressed() {
if (webView.canGoBack()) {
if (webView.getUrl().equals(webUrl)) {
super.onBackPressed();
webView.goBack();
super.onBackPressed();
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
可以尝试分为两步来处理:back还是原样处理,在页面回调事件中处理刷新,注意线程,还有是否会造成shouldOverrideUrlLoading反复被调用的死循环。
public void onBackPressed() {
if (webView.canGoBack()) {
webView.goBack();
super.onBackPressed();
private WebViewClient webViewClient = new WebViewClient() {
public boolean shouldOverrideUrlLoading(final WebView view, String url) {
if (url.equals(webUrl)) {
Utils.getMainThreadHandler().post(new Runnable() {
public void run() {
view.reload();
同步到新浪微博
分享到微博?
关闭理由:
删除理由:
忽略理由:
推广(招聘、广告、SEO 等)方面的内容
与已有问题重复(请编辑该提问指向已有相同问题)
答非所问,不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因(请补充说明)
我要该,理由是:在 SegmentFault,解决技术问题
每个月,我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。
一线的工程师、著名开源项目的作者们,都在这里:
获取验证码
已有账号?
问题对人有帮助,内容完整,我也想知道答案
问题没有实际价值,缺少关键内容,没有改进余地
webView 如何获取html5 按钮的点击事件
重新在controller写个点击函数
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
如果你还在用UIWebView,那么最简单的做法,并且你只有一个按钮需要处理的情况下,是你实现shouldStartLoadWithRequest方法,然后把按钮设置一个特别的链接,在shouldStartLoadWithRequest对按钮前往访问的链接进行一个拦截然后处理
更加复杂一点的,你需要Javascript Bridge,iOS8之后版本可以使用内置的WKWebView(使用很方便,推荐),之前版本可以看看Cordova
分享到微博?
关闭理由:
删除理由:
忽略理由:
推广(招聘、广告、SEO 等)方面的内容
与已有问题重复(请编辑该提问指向已有相同问题)
答非所问,不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因(请补充说明)
我要该,理由是:App混合开发之WebView进行H5页面基本操作 - 知乎专栏
{"debug":false,"apiRoot":"","paySDK":"/api/js","wechatConfigAPI":"/api/wechat/jssdkconfig","name":"production","instance":"column","tokens":{"X-XSRF-TOKEN":null,"X-UDID":null,"Authorization":"oauth c3cef7c66aa9e6a1e3160e20"}}
{"database":{"Post":{"":{"contributes":[{"sourceColumn":{"lastUpdated":,"description":"","permission":"COLUMN_PUBLIC","memberId":,"contributePermission":"COLUMN_PUBLIC","translatedCommentPermission":"all","canManage":true,"intro":"","urlToken":"anxiuyun","id":51416,"imagePath":"4b70deef7","slug":"anxiuyun","applyReason":"0","name":"案秀云","title":"案秀云","url":"/anxiuyun","commentPermission":"COLUMN_ALL_CAN_COMMENT","canPost":true,"created":,"state":"COLUMN_NORMAL","followers":1,"avatar":{"id":"4b70deef7","template":"/{id}_{size}.jpg"},"activateAuthorRequested":false,"following":false,"imageUrl":"/4b70deef7_l.jpg","articlesCount":10},"state":"accepted","targetPost":{"titleImage":"/v2-2ae9b4cd789_r.png","lastUpdated":,"imagePath":"v2-2ae9b4cd789.png","permission":"ARTICLE_PUBLIC","topics":[1800],"summary":"现在淘宝、京东、聚划算、甚至于一些银行的App都是利用原生加H5混合开发技术进行开发的,混合开发越来越成为App开发主流技术。WebView是android内嵌的Web页面访问组件,通过它可以轻松实现原生App代码和H5页面的交互操作,还可以和Js相互调用,是混合开发(…","copyPermission":"ARTICLE_COPYABLE","translatedCommentPermission":"all","likes":0,"origAuthorId":0,"publishedTime":"T18:24:17+08:00","sourceUrl":"","urlToken":,"id":4175377,"withContent":false,"slug":,"bigTitleImage":false,"title":"App混合开发之WebView进行H5页面基本操作","url":"/p/","commentPermission":"ARTICLE_ALL_CAN_COMMENT","snapshotUrl":"","created":,"comments":0,"columnId":51416,"content":"","parentId":0,"state":"ARTICLE_PUBLISHED","imageUrl":"/v2-2ae9b4cd789_r.png","author":{"bio":"it老兵","isFollowing":false,"hash":"72af7f13ed55b5fe7b0a7c79e9e4a145","uid":544600,"isOrg":false,"slug":"an-xiu-yun-17","isFollowed":false,"description":"","name":"案秀云","profileUrl":"/people/an-xiu-yun-17","avatar":{"id":"v2-566cc1ed44a90f0a4fec101f8ed2b05e","template":"/{id}_{size}.jpg"},"isOrgWhiteList":false},"memberId":,"excerptTitle":"","voteType":"ARTICLE_VOTE_CLEAR"},"id":855855}],"title":"App混合开发之WebView进行H5页面基本操作","author":"an-xiu-yun-17","content":"现在淘宝、京东、聚划算、甚至于一些银行的App都是利用原生加H5混合开发技术进行开发的,混合开发越来越成为App开发主流技术。WebView是android内嵌的Web页面访问组件,通过它可以轻松实现原生App代码和H5页面的交互操作,还可以和Js相互调用,是混合开发(Hyprid App)常用的技术。Android的WebView在4.4后使用chrome内核,之前采用了不同的Webkit版本内核。(代码下载可以关注案秀云或者进群:)一、用WebView加载网页:在进行代码之前需要给应用程序设置网络访问权限并把控件引入对应的容器:权限:&uses-permission android:name=\"android.permission.INTERNET\"/&在容器内引入WebView控件:&WebViewandroid:layout_width=\"match_parent\"android:layout_height=\"match_parent\"android:id=\"@+id/webView\"/&页面加载具体的代码:webView=(WebView)view.findViewById(R.id.webView);WebSettings webSettings = webView.getSettings();webSettings.setJavaScriptEnabled(true);//设置支持javascript//打开的具体地址,可以是百度、新浪等,这是加载的案秀云提供的文章webView.loadUrl(\";);webView.setWebViewClient(new WebViewClient(){@Overridepublic boolean shouldOverrideUrlLoading(WebView view, String url) {view.loadUrl(url);//返回值是true的时候控制去WebView打开,为false调用系统浏览器或第三方浏览器}});打开的页面如下:其中loadurl函数有多种用法:1、可以加载一个Web页面如: webView.loadUrl(\"\"); 2、加载打包程序中的html页面,html保存在asset目录下, webView.loadUrl(\"file:///android_asset/anxiuyun.html\"); 3、加载手机本地的html页面 webView.loadUrl(\"content://com.android.htmlfileprovider/sdcard/anxiuyun.html\"); 4、加载 HTML 页面的一小段内容 WebView.loadData(String data, String mimeType, String encoding) // 参数说明:参数1:需要截取展示的内容 // 内容里不能出现 ’#’, ‘%’, ‘’ , ‘?’ 这四个字符,若出现了需用 %23, %25, %27, %3f 对应来替代,否则会出现异常 // 参数2:展示内容的类型 // 参数3:字节码设置支持JS代码:webSettings.setJavaScriptEnabled(true);//设置支持javascript,如果不设置页面中一些通过js动态调用数据就显示不出来设置用WebView打开页面还是调用系统浏览器或第三方浏览器打开页面:webView.setWebViewClient()//默认情况下WebView是调用系统默认的浏览器或者第三方浏览器打开页面,通过webView.setWebViewClient(new WebViewClient(){...重写后,页面是在WebView中打开的。二、判断页面加载过程webView.setWebChromeClient(new WebChromeClient() { @Overridepublic void onProgressChanged(WebView view, int newProgress) {if (newProgress == 100) {// 网页加载完成} else {// 加载中}}});三、页面前进/后退操作//判断是否可以后退webView.canGoBack()//后退网页webView.goBack()//判断是否可以前进webView.canGoForward()//前进网页webView.goForward()//以当前的index为起始点前进或者后退到历史记录中指定的steps//如果steps为负数则为后退,正数则为前进webView.goBackOrForward(intsteps)四、Back键控制网页后退在App中如果不做任何代码处理,在点击系统的“Back”键时,整个 Browser 会调用 finish()而结束自身,而我们实质想进行页面后退操作,为避免这情况具体代码:在当前Activity中监听按键事件,并消费掉系统默认的 Back 事件public boolean onKeyDown(int keyCode, KeyEvent event) {if ((keyCode == KEYCODE_BACK) && webView.canGoBack()) {webView.goBack();}return super.onKeyDown(keyCode, event);}五、WebSettings子类其它的一些用法//获得WebSettings子类 WebSettings webSettings = webView.getSettings(); //缩放操作webSettings.setSupportZoom(true); //支持缩放,默认为true。是下面那个的前提。 webSettings.setBuiltInZoomControls(true); //设置内置的缩放控件。若为false,则该WebView不可缩放 webSettings.setDisplayZoomControls(false); //隐藏原生的缩放控件webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK); //关闭webview中缓存 webSettings.setAllowFileAccess(true); //设置可以访问文件 webSettings.setJavaScriptCanOpenWindowsAutomatically(true); //支持通过JS打开新窗口 webSettings.setLoadsImagesAutomatically(true); //支持自动加载图片 webSettings.setDefaultTextEncodingName(\"utf-8\");//设置编码格式//设置自适应屏幕,两者合用webSettings.setUseWideViewPort(true); //将图片调整到适合webview的大小webSettings.setLoadWithOverviewMode(true); // 缩放至屏幕的大小","updated":"T10:24:17.000Z","canComment":false,"commentPermission":"anyone","commentCount":0,"collapsedCount":0,"likeCount":0,"state":"published","isLiked":false,"slug":"","isTitleImageFullScreen":false,"rating":"none","titleImage":"/v2-2ae9b4cd789_r.png","links":{"comments":"/api/posts//comments"},"reviewers":[],"topics":[{"url":"/topic/","id":"","name":"Android 开发"}],"adminClosedComment":false,"titleImageSize":{"width":544,"height":373},"href":"/api/posts/","excerptTitle":"","column":{"slug":"anxiuyun","name":"案秀云"},"tipjarState":"inactivated","annotationAction":[],"sourceUrl":"","pageCommentsCount":0,"hasPublishingDraft":false,"snapshotUrl":"","publishedTime":"T18:24:17+08:00","url":"/p/","lastestLikers":[],"summary":"现在淘宝、京东、聚划算、甚至于一些银行的App都是利用原生加H5混合开发技术进行开发的,混合开发越来越成为App开发主流技术。WebView是android内嵌的Web页面访问组件,通过它可以轻松实现原生App代码和H5页面的交互操作,还可以和Js相互调用,是混合开发(…","reviewingCommentsCount":0,"meta":{"previous":{"isTitleImageFullScreen":false,"rating":"none","titleImage":"/50/v2-8bd86f7b4c29b0bdecdb_xl.jpg","links":{"comments":"/api/posts//comments"},"topics":[{"url":"/topic/","id":"","name":"app制作开发"}],"adminClosedComment":false,"href":"/api/posts/","excerptTitle":"","author":{"bio":"it老兵","isFollowing":false,"hash":"72af7f13ed55b5fe7b0a7c79e9e4a145","uid":544600,"isOrg":false,"slug":"an-xiu-yun-17","isFollowed":false,"description":"","name":"案秀云","profileUrl":"/people/an-xiu-yun-17","avatar":{"id":"v2-566cc1ed44a90f0a4fec101f8ed2b05e","template":"/{id}_{size}.jpg"},"isOrgWhiteList":false},"column":{"slug":"anxiuyun","name":"案秀云"},"content":"App混合开发(英文名:Hybrid App),是指在开发一款App产品的时候为了提高效率、节省成本即利用了原生的开发技术还应用了HTML5开发技术,是原生和HTML5技术的混合应用。目前App的开发主要包含三种方式:原生开发、HTML5开发和混合 开发。原生应用开发,是在Android、IOS等移动平台上利用官方提供的开发语言、开发类库、开发工具进行App开发。比如android是利用java、eclipse、Android studio,IOS是利用Objective-C 和Xcode进行开发。原生应用由于利用的是官方提供的语言和工具并且能够直接操控硬件设备(比如多点触控、NFC、读取短信等),在应用性能上和交互体验上应该是最好的,但是原生应用的可移植性比较差,特别是一款原生的App,Android和IOS都要各自开发,同样的逻辑、界面要写两套。HTML5应用开发,是利用Web技术进行的App开发,我们知道web技术本身需要浏览器的支持才能进行展示和用户交互。主要用到的技术是HTML5、JavaScript、CSS等。现在还有一些开发框架可以利用,比如phoneGap、bootstrap、jquery等。H5开发的好处是可以跨平台,编写的代码可以同时在Android、IOS、Windows上进行运行。由于Web技术本身的限制,H5移动应用不能直接访问设备硬件和离线存储,所以在体验和性能上有很大的局限性。混合应用开发正是结合原生和H5开发的技术,取长补短的一种开发模式,原生代码部分利用WebView插件或者其它的框架为H5提供了一个容器,程序主要的业务实现、界面展示是利用H5相关的Web技术进行实现的。比如现在的京东、淘宝、今日头条等都是利用的混合开发模式。混合开发的优缺点:优点是:1、开发效率高,节约时间同一套代码Android和IOS基本都可用2、更新和部署比较方便,不需要每次升级都要上传到App Store进行审核了,只需要在服务器端升级就可以3、代码维护方便、版本更新快,降低产品成本缺点是:1、由于不能直接操控硬件有些方面性能不是很好2、另外有技术比较新版本的兼容性比较差,还有就是即懂原生开发又懂H5开发的高端人才难找。混合App开发是未来的趋势,目前混合开发中使用的技术也很多,主要的混合开发技术有jQuery Mobile、React Native、Cordova、APICloud、AppCan等。虽然混合开发能够提高效率节省成本,但也有很多的限制,除了硬件、缓存等的限制,各大平台之间的兼容性也不足。有的也比较消耗资源。案秀云Android端利用WebView进行混合开发(有兴趣的同学可以进qq群交流: 或者搜索微信公众号“案秀云”下载最新代码)三种开发模式基本功能的对比(因平台版本、应用情况不同经供参考)","state":"published","sourceUrl":"","pageCommentsCount":0,"canComment":false,"snapshotUrl":"","slug":,"publishedTime":"T20:14:33+08:00","url":"/p/","title":"浅谈App原生开发、混合开发及HTML5开发的优劣","summary":"App混合开发(英文名:Hybrid App),是指在开发一款App产品的时候为了提高效率、节省成本即利用了原生的开发技术还应用了HTML5开发技术,是原生和HTML5技术的混合应用。目前App的开发主要包含三种方式:原生开发、HTML5开发和混合 开发。原生应用开发,是…","reviewingCommentsCount":0,"meta":{"previous":null,"next":null},"commentPermission":"anyone","commentsCount":0,"likesCount":1},"next":{"isTitleImageFullScreen":false,"rating":"none","titleImage":"/50/v2-075a1f180d3b48bd27c139aa7ec7b60c_xl.jpg","links":{"comments":"/api/posts//comments"},"topics":[{"url":"/topic/","id":"","name":"GIT项目"}],"adminClosedComment":false,"href":"/api/posts/","excerptTitle":"","author":{"bio":"it老兵","isFollowing":false,"hash":"72af7f13ed55b5fe7b0a7c79e9e4a145","uid":544600,"isOrg":false,"slug":"an-xiu-yun-17","isFollowed":false,"description":"","name":"案秀云","profileUrl":"/people/an-xiu-yun-17","avatar":{"id":"v2-566cc1ed44a90f0a4fec101f8ed2b05e","template":"/{id}_{size}.jpg"},"isOrgWhiteList":false},"column":{"slug":"anxiuyun","name":"案秀云"},"content":"当你看到这篇文章的时候,相信你对Git和GitHub(Git是分布式版本控制系统,GitHub是基于Git的项目版本控制托管平台,通过注册后就可以使用Git服务发布管理自己项目,项目可以公开也可以设置私有)已经有所了解,所以这里就不对Git、svn、CVS做介绍了,咱们就直奔主题了。一、GitHub下载地址:下载链接: 我是下载的Windows64位程序,基本是默认选项安装,安装成功后可以在本机目下点击右键菜单创建自己的本地Git库,安装目录需要记住,在下边会用到。本篇文章针对的Android studio 通过Git连接GitHub。所以对于本地建库,不做介绍。二、Android studio 配置Git从文件菜单中进入Settings设置,如下图:在Settings对话框配置Git.exe路径:配置完路径后可以测试是否成功,如图:三、在GitHub创建项目1、在Settings界面添加GitHub账号,并点击测试,如下图:2、上传自己的项目到GitHub输入仓库名称点击共享:选择要共享的文件点击确认:四、Android studio GitHub的基本操作在所要操作的目录或者文件上点击右键,如下图1、点击Add将项目纳入到GitHub仓库中2、通过Commit 提交文件到本地仓库中,对于一些提示不用管直接点击确认就好3、当push代码到github时,会提示登录GitHub4、push完成后可GitHub看到上传的项目 5、当本地和远程文件有冲突的时候,可以用Merge进行合并操作 ","state":"published","sourceUrl":"","pageCommentsCount":0,"canComment":false,"snapshotUrl":"","slug":,"publishedTime":"T22:31:36+08:00","url":"/p/","title":"android studio 配置操作Github并发布一个开源项目","summary":"当你看到这篇文章的时候,相信你对Git和GitHub(Git是分布式版本控制系统,GitHub是基于Git的项目版本控制托管平台,通过注册后就可以使用Git服务发布管理自己项目,项目可以公开也可以设置私有)已经有所了解,所以这里就不对Git、svn、CVS做介绍了,咱们…","reviewingCommentsCount":0,"meta":{"previous":null,"next":null},"commentPermission":"anyone","commentsCount":0,"likesCount":0}},"annotationDetail":null,"commentsCount":0,"likesCount":0,"FULLINFO":true}},"User":{"an-xiu-yun-17":{"isFollowed":false,"name":"案秀云","headline":"","avatarUrl":"/v2-566cc1ed44a90f0a4fec101f8ed2b05e_s.jpg","isFollowing":false,"type":"people","slug":"an-xiu-yun-17","bio":"it老兵","hash":"72af7f13ed55b5fe7b0a7c79e9e4a145","uid":544600,"isOrg":false,"description":"","profileUrl":"/people/an-xiu-yun-17","avatar":{"id":"v2-566cc1ed44a90f0a4fec101f8ed2b05e","template":"/{id}_{size}.jpg"},"isOrgWhiteList":false,"badge":{"identity":null,"bestAnswerer":null}}},"Comment":{},"favlists":{}},"me":{},"global":{"experimentFeatures":{"ge3":"ge3_9","ge2":"ge2_1","nwebStickySidebar":"sticky","newMore":"new","liveReviewBuyBar":"live_review_buy_bar_2","liveStore":"ls_a2_b2_c1_f2","isOffice":"false","homeUi2":"default","answerRelatedReadings":"qa_recommend_with_ads_and_article","remixOneKeyPlayButton":"headerButton","qrcodeLogin":"qrcode","newBuyBar":"livenewbuy3","newMobileColumnAppheader":"new_header","zcmLighting":"zcm","favAct":"default","appStoreRateDialog":"close","mobileQaPageProxyHeifetz":"m_qa_page_nweb","iOSNewestVersion":"4.2.0","default":"None","wechatShareModal":"wechat_share_modal_show","qaStickySidebar":"sticky_sidebar","androidProfilePanel":"panel_b"}},"columns":{"next":{},"anxiuyun":{"following":false,"canManage":false,"href":"/api/columns/anxiuyun","name":"案秀云","creator":{"slug":"an-xiu-yun-17"},"url":"/anxiuyun","slug":"anxiuyun","avatar":{"id":"4b70deef7","template":"/{id}_{size}.jpg"}}},"columnPosts":{},"columnSettings":{"colomnAuthor":[],"uploadAvatarDetails":"","contributeRequests":[],"contributeRequestsTotalCount":0,"inviteAuthor":""},"postComments":{},"postReviewComments":{"comments":[],"newComments":[],"hasMore":true},"favlistsByUser":{},"favlistRelations":{},"promotions":{},"switches":{"couldAddVideo":false},"draft":{"titleImage":"","titleImageSize":{},"isTitleImageFullScreen":false,"canTitleImageFullScreen":false,"title":"","titleImageUploading":false,"error":"","content":"","draftLoading":false,"globalLoading":false,"pendingVideo":{"resource":null,"error":null}},"drafts":{"draftsList":[],"next":{}},"config":{"userNotBindPhoneTipString":{}},"recommendPosts":{"articleRecommendations":[],"columnRecommendations":[]},"env":{"edition":{},"isAppView":false,"appViewConfig":{"content_padding_top":128,"content_padding_bottom":56,"content_padding_left":16,"content_padding_right":16,"title_font_size":22,"body_font_size":16,"is_dark_theme":false,"can_auto_load_image":true,"app_info":"OS=iOS"},"isApp":false},"sys":{},"message":{"newCount":0},"pushNotification":{"newCount":0}}

我要回帖

更多关于 h5页面音乐播放按钮 的文章

 

随机推荐