簡單的瀏覽器列印demo（相容chrome/IE/firefox，表現略有差異）

阿新 • • 發佈：2019-01-08

目前在chrome/IE11/firefox下都能執行，但效果略有差異，只有chrome有預覽功能。
chrome效果：
chrome效果圖
firefox效果：
firefox效果圖
IE效果圖：

程式碼：

<!doctype html>
<html lang='en'>
<head>
    <meta charset='UTF-8'>
    <meta name='viewport'
          content='width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' 
>
    <meta http-equiv='X-UA-Compatible' content='ie=edge'>
    <title>列印</title>
    <style>
        #printPage {
            display: none;
        }
    </style>
</head>
<body>
哈哈哈，拜託印表機了
<button onclick='printPage()'>戳我列印</button>
<!--實際要列印的內容放在這個div中--> 

<div id='printPage'>
    <h1>列印標題</h1>
    <table>
        <thead>
        <th>name</th>
        <th>title</th>
        <th>level</th>
        </thead>
        <tbody>
        <tr>
            <td>小明</td>
            <td 
>前端工程師</td>
            <td>資深專家</td>
        </tr>
        </tbody>
    </table>
</div>
<!--以上 實際要列印的內容-->
<script>
  function printPage() {
    var printHTML = document.getElementById('printPage').innerHTML;// 獲取要列印的內容
    var page = window.open('', '_blank');// 開啟一個新視窗，用於列印
    page.document.write(printHTML);// 寫入列印頁面的內容
    page.print();// 列印
    var userAgent = navigator.userAgent;
    if ((userAgent.indexOf('compatible') > -1 && userAgent.indexOf('MSIE') > -1) || (userAgent.indexOf("Edge") > -1) || (userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1)) {
      // IE瀏覽器
      page.document.execCommand('print');
    } else {
      console.log('not IE');
    }
    page.close();// 關閉列印視窗
  }
</script>
</body>
</html>

簡單的瀏覽器列印demo（相容chrome/IE/firefox，表現略有差異）

目前在chrome/IE11/firefox下都能執行，但效果略有差異，只有chrome有預覽功能。 chrome效果： firefox效果： IE效果圖：程式碼： <!d

JS 讀取Excel檔案(xls) 相容Chrome/IE/Firefox

想讀取Excel首先需要兩個JS檔案。下載地址 Html程式碼: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.

瀏覽器尺寸判斷（相容標準及低版本ie瀏覽器）

1.總體思路：先判斷瀏覽器型別，再根據不同瀏覽器型別用不同方法獲取瀏覽器尺寸； 2.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <tit

js監聽瀏覽器,關閉,重新整理（相容IE6+,Firefox,Chrome,Safari）

js阻止瀏覽器關閉重新整理、js監聽瀏覽關閉重新整理；對Alt+F4 、右鍵關閉都起作用 var UnloadConfirm = {}; UnloadConfirm.MSG_UNLOAD = "資料尚未儲存，離開後可能會導致資料丟失\n\n您確定要離開嗎？";

textarea字元查詢並且高亮顯示,相容Chrome,IE

指令碼其實很簡單-愛心列印指令碼（1）

教程簡介本系列教程（指令碼其實很簡單）的目的是熟悉Windows下的bat指令碼和Linux下的bash shell指令碼。指令碼的特性就在於不依賴於特定環境，直接呼叫作業系統，不需要“中間人”就可以執行。文章簡介作為系列的第一篇文章，思來想去，最終兼顧程式設計師和屌絲單身貴族的身份，打算完成

js使瀏覽器視窗最大化（適用於IE的方法）

這裡使用的方法是IE的私有特性，只能在IE中有效。主要是window.moveTo和window.resizeTo方法。效果和點選最大化按鈕差不多，有一點區別。點選最大化按鈕後，瀏覽器的內容填充滿顯示器，瀏覽器視窗的邊框被擠出顯示器。而該js的最大化效果是瀏覽

duilib + cef簡單瀏覽器的demo

參考連線： https://bitbucket.org/chromiumembedded/cef/wiki/Home 自己寫的demo地址： http://download.csdn.net/detail/shuaixingrumo/9556308 關於編譯duilib

Android呼叫相簿、相機（相容6.0、7.0、8.0）所需新增的許可權

在AndroidManifest.xml中新增：  <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/&

CSS相容Chrome和Firefox

在做頁面相容Chrome和Firefox瀏覽器時，有時候會由於css樣式導致兩者顯示不一致，比如在Chrome上顯示正常，而在Firefox上可能就會出現縱向滾動條，這時候就要針對不同型別瀏覽器應用不同的css樣式了，下面是不同的瀏覽器CSS hank。比如一個css樣式如下： .co

H5 file呼叫手機相機和相簿（相容安卓ios，親測有效）

<input id="input" type="file"/>標籤，iOS直接吊起相機拍照或是相簿選擇，但Android中只調起選擇相簿，沒有調起相機拍照解決辦法：只需要加上 accept="image/*" 就完美的相容安卓和IOS了（accept表示開啟的系統檔案目錄） <

瀏覽器渲染原理（效能優化之如何減少重排和重繪）

繼續上篇《瀏覽器位址列裡輸入URL後的全過程》前言為什麼要了解瀏覽器的渲染原理？瞭解瀏覽器的渲染原理有什麼好處？我們做前端開發為什麼非要了解瀏覽器的原理？直接把網頁做出來，什麼需求，直接一把梭，擼完收工不好嗎。但是經常會有人會問，什麼是重排和重繪？重排也叫迴流（Re

利用Hibernate進行簡單的增刪改查（未使用JPA註解，以Oracle為例）

第一步、建立一個Java專案，名為Hibernate_one 第二步、載入jar包，在src下建立了lib資料夾，用來存放jar包（jar包必須一個都不能少）。如圖我連線的資料庫是Oracle，所以得載入Oracle的驅動包ojdbc6，如果用mysql資料庫，可從網上

Google Chrome/IE/FireFox檢視HTTP請求頭request header響應頭response header|審查元素Network空的不顯示

來自：http://1.snowson.sinaapp.com/?p=359 chrome檢視網頁header，滑鼠右鍵開啟審查元素，或快捷鍵Shift+Ctrl+I或者shift+ctrl+c 當我開啟Network後，發現裡面是空的什麼也沒有。查了下，才知，需要重

前後端分離（跨域）sessionid不一致Safari瀏覽器解決方案（不能保持會話或者不能儲存cookie）

對於前後端分離的專案或者單點登入的系統後臺需要做session會話校驗或者cookie跨域儲存，Safari瀏覽器可能會遇到無法儲存cookie的時候，解決方案如下：PC端Safari瀏覽器需要設定偏好設定-> Safari -> 阻止Cookie ->

C語言——printf列印字串（關於資料在記憶體中儲存格式的體現）

PS:本篇文章，是筆者在C語言學習過程中的所產生疑惑的地方，經過查閱相關資料得出的結論，如有錯誤的地方，還望指出改正。 int 佔4個位元組，這裡輸入的8位16進位制數每相鄰兩位數代表一個位元組。如：44，43，42，41 int b = 0x414

51nod 1376 最長遞增子序列的數量（不是dp哦，線段樹 + 思維）

sort 是個 can stream const 方便 long 序列 printf 題目鏈接：https://www.51nod.com/onlineJudge/questionCode.html#!problemId=1376 題解：顯然這題暴力的方法很容易想到

微信小程序之初探（常見語法 VS vue）常見問題（點擊不生效，數據綁定）

數據驅動一點驅動 win -1 沒有 html cat been 最近在調研微信小程序開發，對於一個前端小白來說，在各種框架都還用不熟的情況下，再來開發小程序確實還是不容易。小程序出來之初，聽過演講，看過一點點兒視頻，感覺和angular語法有點相似（PS：那是也是只

oralce數據庫常用到的一些sql命令（加字段註釋，修改數據之類）

一個 png 找到 sql命令 sub 字段名 tab date font 最近開始接觸oralce，整理了一下最近使用 pl/sql 常用到的一些sql命令 1.修改表中的數據編寫查詢語句及條件，然後加上"FOR UPDATE"，"FOR UPDATE"是獲得OACLE

cocos2d-x 源代碼分析： EventDispatcher、EventListener、Event 源代碼分析（新觸摸機制，新的NotificationCenter機制）

get cti state 2.7 return 3.1 成了 available been 源代碼版本號來自3.x，轉載請註明 cocos2d-x 源代碼分析總文件夾 http://blog.csdn.net/u011225840/article/detail

簡單的瀏覽器列印demo（相容chrome/IE/firefox，表現略有差異）

相關推薦