H5 開發中常見的小問題

来源:https://www.cnblogs.com/nmxs/archive/2019/04/19/10735512.html
-Advertisement-
Play Games

1.解決 瀏覽器 返回按鈕不刷新的問題 window.onpageshow = function(event) { if (event.persisted) { window.location.reload() }};2.H5 中 JS 禁用安卓手機物理返回鍵 XBack = {}; (functi ...


1.解決 瀏覽器 返回按鈕不刷新的問題
  window.onpageshow = function(event) {
    if (event.persisted) {
      window.location.reload()
  }};
2.H5 中 JS 禁用安卓手機物理返回鍵
  XBack = {};
  (function(XBack) {
    XBack.STATE = 'x - back';
    XBack.element;

    XBack.onPopState = function(event) {
      event.state === XBack.STATE && XBack.fire();
      XBack.record(XBack.STATE); //初始化事件時,push一下
    };

    XBack.record = function(state) {
      history.pushState(state, null, location.href);
    };

    XBack.fire = function() {
      var event = document.createEvent('Events');
      event.initEvent(XBack.STATE, false, false);
      XBack.element.dispatchEvent(event);
    };

    XBack.listen = function(listener) {
      XBack.element.addEventListener(XBack.STATE, listener, false);
    };

    XBack.init = function() {
      XBack.element = document.createElement('span');
      window.addEventListener('popstate', XBack.onPopState);
      XBack.record(XBack.STATE);
    };

  })(XBack); // 引入這段js文件

  XBack.init();
  XBack.listen(function() {});

3.解決移動端底部input被彈出的鍵盤遮擋問題
  方法1、
    Element.scrollIntoView(); // 讓當前的元素滾動到瀏覽器視窗的可視區域內
    document.querySelector('#inputId').scrollIntoView();
  方法2:

    Element.scrollIntoViewIfNeeded();


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 核心屬性: background-attachment 這個屬性就牛逼了, 它可以定義背景圖片是相對視口固定, 還是隨著視口滾動, 加上這個屬性網頁瞬間就從屌絲變成 高大上。 我們來看個例子: html: css: 代碼很簡單,讓視口出現滾動條, 然後它是這樣的: 很普通的一個滾動效果, 然後我們把 ...
  • 處理數值,為每三位數加一個逗號,相容浮點型數值 以 和 為例 通過內置方法實現 通過正則表達式 利用正則表達式來處理的思路: 整數和浮點數是有差別的,整數從最右邊開始算,浮點數要從小數點'.'開始算 字元串分為兩部分,右邊是3 n位數字,左邊的部分添加','。n = {1,} 右邊的部分很好匹配: ...
  • jQuery選擇器一、基本選擇器: 1、ID選擇器 #id 描述:根據給定的id匹配一個元素, 返回單個元素(註:在網頁中,id名稱不能重覆) 2、類選擇器 .class 描述:根據給定的類名匹配元素,返回元素集合 3、元素選擇器 element 描述:根據給定的元素名匹配元素,返回元素集合 4、* ...
  • 一、為什麼JavaScript是單線程? JavaScript語言的一大特點就是單線程,也就是說,同一個時間只能做一件事。那麼,為什麼JavaScript不能有多個線程呢?這樣能提高效率啊。 JavaScript的單線程,與它的用途有關。作為瀏覽器腳本語言,JavaScript的主要用途是與用戶互動 ...
  • v-bind和v-model的區別 1.v-bind用來綁定數據和屬性以及表達式,縮寫為':' 2.v-model使用在表單中,實現雙向數據綁定的,在表單元素外使用不起作用 v-bind和v-model的區別 什麼是 mvvm? MVVM 是 Model-View-ViewModel 的縮寫。mvv ...
  • 其實這種功能,網上相關的代碼多的是,我也是因為今天正好要用到這個功能,所以臨時寫了下,放這裡保存下,以便將來自己或者別人用的上吧。 當然我寫的是一個hta文件。下麵是完整js代碼,都是調用activex控制項去做事,所以也沒有考慮瀏覽器相容什麼的。 代碼主要分為: 1.選擇目標文件夾 2.遍歷目標文件 ...
  • javascript基礎篇詳情 2019-04-19 簡介 定義 javascript是一門動態弱類型的解釋型編程語言,增強頁面動態效果,實現頁面與用戶之間的實時動態的交互。 javascript是由三部分組成:ECMAScript、DOM、BOM ECMAScript由ECMA-262定義,提供核 ...
  • ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...