escape() 函數可對字符串進行編碼,這樣就能夠在全部的計算機上讀取該字符串。javascript
語法:css
escape(string)html
例子:前端
<!DOCTYPE html> <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css"> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> <script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script> <style> </style> </head> <body> </body> <script> document.write(escape("wang xiaoting!") + "<br />") document.write(escape("?!=()#%&")) </script> </html>
unescape() 函數可對經過 escape() 編碼的字符串進行解碼。java
語法:jquery
unescape(string)json
在本例中,咱們將使用 escape() 來編碼字符串,而後使用 unescape() 對其解碼:bootstrap
<!DOCTYPE html> <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css"> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> <script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script> <style> </style> </head> <body> </body> <script type="text/javascript"> var test1="wang xiao ting !" test1=escape(test1) document.write (test1 + "<br />") test1=unescape(test1) document.write(test1 + "<br />") </script> </html>
舉個栗子:服務器
實際應用在項目裏面app
html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Dashboard | Nadhif - Responsive Admin Template</title> <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css"> <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap-table/1.15.4/bootstrap-table.min.css"> <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script> <script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="https://cdn.bootcss.com/bootstrap-table/1.15.4/bootstrap-table.min.js"></script> <script src="https://cdn.bootcss.com/bootstrap-table/1.15.4/locale/bootstrap-table-zh-CN.min.js"></script> </head> <style> .page-content-wrapper { width: 800px; position: absolute; top: 10%; left: 24%; background: #fff; border: 1px solid #999; padding: 3% 0 0 9%; display: none; } .inputstyle { width: 60%; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 4px; } </style> <body> <table id="mytab" class="table table-hover"></table> <!-- 新增和修改界面 --> <div class="page-content-wrapper"> <input type="text" class="inputstyle" id="id" style="display: none;"> <div class="form-group"> <label>工號:</label> <input type="text" class="inputstyle" id="deviceId"> </div> <div class="form-group"> <label>姓名:</label> <input type="text" class="inputstyle" id="name"> </div> <div class="form-group"> <label>電話:</label> <input type="text" class="inputstyle" id="phone"> </div> <div class="form-group"> <label>公司:</label> <input type="text" class="inputstyle" id="organName"> </div> <div class="modal-footer"> <button type="button" class="btn default" data-dismiss="modal" id="close">關閉</button> <button type="button" class="btn blue" id="addBtn">保存</button> </div> </div> <script> $('#mytab').bootstrapTable({ method: 'get', url: "test.json", // 請求路徑 striped: true, // 是否顯示行間隔色 pageNumber: 1, // 初始化加載第一頁 pagination: true, // 是否分頁 sidePagination: 'client', // server:服務器端分頁|client:前端分頁 pageSize: 5, // 單頁記錄數 pageList: [5, 20, 30], // showRefresh : true,// 刷新按鈕 queryParams: function(params) { // 上傳服務器的參數 var temp = { }; return temp; }, columns: [{ title: 'id', field: 'id', visible: false }, { title: '工號', field: 'deviceId', }, { title: '姓名', field: 'name', }, { title: '聯繫電話', field: 'phone' }, { title: '公司部門', field: 'organName' }, { title: '操做', field: 'id', formatter: option }] }) // 定義刪除、更新按鈕 function option(value, row, index) { var htm = ""; htm = '<button id="upd" onclick="update(\'' + escape(JSON.stringify(row)) + '\')">修改</button>'; return htm; } function update(row) { $(".page-content-wrapper").show(); var data = JSON.parse(unescape(row)) $('#deviceId').val(data.deviceId) $('#name').val(data.name) $('#phone').val(data.phone) $('#organName').val(data.organName) } $("#close").on("click", function() { $(".page-content-wrapper").hide(); }) </script> </body> </html>
test.json
[ { "id": 1, "deviceId": "43445", "name": "王小婷", "phone": "1567865475", "organName": "字節跳動" }, { "id": 2, "deviceId": "53456", "name": "最帥的壞兔子", "phone": "1567865475", "organName": "騰訊" },{ "id": 3, "deviceId": "2345", "name": "阿強", "phone": "1567865475", "organName": "360" },{ "id": 4, "deviceId": "2345", "name": "阿花", "phone": "1567865475", "organName": "百度" }, { "id": 5, "deviceId": "2345", "name": "阿奶", "phone": "1567865475", "organName": "螞蟻金服" },{ "id": 5, "deviceId": "2345", "name": "阿狗", "phone": "1567865475", "organName": "阿里" } ]
首先使用escape對字符串進行編碼,而後使用unescape() 函數對編碼的字符串進行解碼。