errorBook.js · 前端技术指南

## 前言本文为根据jsBridge约定实现的错题本的通讯案例。 ~~~ window.bridge = require('../../js/common/JSBridge.js'); var info = require('../common/ua.js'); var token; var isJSBridge = false; $(document).ready(function(){ if(info.os == 'iOS'){ window.isReady = function(){ if(window.xhxapp&&window.xhxapp.getUserInfo){ window.xhxapp.getUserInfo('setUserInfo'); } window.setUserInfo = function(user){ token = user.token; } } } if(info.os == 'iOS'){ window.iOSReady = function(){ isJSBridge = true; var data = {} // bridge.h5CallNative('getUserInfo', data, (data) => { // token = data.token; // console.log(token); // }, (error) => { // console.log(error); // }); bridge.h5CallNative('getUserInfo', data, function(data){ token = data.token; console.log(token); }, function(error){ console.log(error); }) } } else { if(window.xhxapp&&window.xhxapp.h5CallNative){ isJSBridge = true; var data = {}; // bridge.h5CallNative('getUserInfo', data, (data) => { // // console.log(data.token); // token = data.token; // console.log(token); // }, (error) => { // console.log(error); // }); bridge.h5CallNative('getUserInfo', data, function(data){ token = data.token; console.log(token); }, function(error){ console.log(error); }) } else { if(window.xhxapp){ //获取token var getUserInfo = JSON.parse( window.xhxapp.getUserInfo()); token = getUserInfo.token; console.log(token); } } } }) document.body.onload = function() { // MathJax.Hub.Config({ // jax: ["input/TeX", "output/SVG", "output/PreviewHTML"], // extensions: ["tex2jax.js", "MathMenu.js", "MathZoom.js", "fast-preview.js", "AssistiveMML.js", "a11y/accessibility-menu.js"], // TeX: { // extensions: ["AMSmath.js", "AMSsymbols.js", "noErrors.js", "noUndefined.js"] // } // }); function showError(msg) { //$('#j_ebContainer').html('<div class="load-error">' + msg + '</div>'); $('#j_ebContainer').html('<div class="data-fail">' +'<img src="../image/common/icon-server-error@2x.png" />' +'<div class="text">数据获取失败</div>' +'<div class="tip">服务器忙，请稍后再试</div>' +'<span class="btn" onclick="window.location.reload()">重新加载</span>' +'</div>'); } /** * 构建html * * @param {any} res 源数据 */ function buildHtml(res) { if (res.success && res.data && res.data.resultObject) { res.data.resultObject.staticWebPath = STATIC_WEB_PATH; var tempStr = template('qsDetailTemplate', res.data.resultObject); var tempHtml = $(tempStr).get(0); MathJax.Hub.Typeset(tempHtml, function(){ $('#j_ebContainer').html(tempHtml); selectError(); sureError(); }); $(".eb--body").on("click", ".interactImg", function(){ var imgUrl = $(this).attr("src"); var imgArr = [imgUrl]; if(isJSBridge){ var data = { imgArr: imgArr, index: 1 } bridge.h5CallNative('showPictureBrower', data); }else{ if(xhxapp&&xhxapp.showPictureBrower){ xhxapp.showPictureBrower(imgArr, 1); } } }); } else { showError(res.message + '，请稍后重试'); } } if ($.getSearchObj('wrongQuestionId')) { $.get(PROXY_WEB_PATH + '/my/errorbook', { wrongQuestionId: $.getSearchObj('wrongQuestionId'), token: token }).done(function(data, status, xhr) { buildHtml(data); }).fail(function(xhr, errorType, error) { showError('无法连接到服务器，请稍后重试'); }) } else { showError('参数不能为空'); } // $("#j_ebContainer").on("touchstart", ".data-fail .btn", function(e){ // alert("bbb"); // location.reload(); // }); function selectError(){ $('.selectError').click(function(){ if($('.errorList').hasClass('errorListHidden')){ $('.errorList').removeClass('errorListHidden'); $('.selectError').removeClass('selectErrorDown').addClass('selectErrorUp'); }else{ $('.errorList').addClass('errorListHidden'); $('.selectError').removeClass('selectErrorUp').addClass('selectErrorDown'); } }) } function sureError(){ $('.errorItem').click(function(){ var code = $(this).attr('data-code'); var name = $(this).html(); $('.selectError').html(name); $('.errorItem').removeClass('errorItemClick'); $(this).addClass('errorItemClick'); if($.getSearchObj('wrongQuestionId')){ $.ajax({ url: PROXY_WEB_PATH + '/my/markWrongReason', type: 'GET', data: { wrongQuestionId: $.getSearchObj('wrongQuestionId'), wrongReasonCode: code, token: token }, dataType: 'json', success: function(d){ if(d){ $('.errorList').addClass('errorListHidden'); $('.selectError').removeClass('selectErrorUp').addClass('selectErrorDown'); if(isJSBridge){ var data = { code: code, name: name } bridge.h5CallNative('updateWrongReason', data); } else { if(xhxapp && xhxapp.updateWrongReason){ xhxapp.updateWrongReason(Number(code), name); } } } }, error: function(error){ console.log('error',error); } }) } }) } } ~~~