portal html css js resource

shareArticalinfor.html 12KB

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <link rel="stylesheet" href="../css/reset.css" /> <link rel="stylesheet" href="../css/common.css" /> <link rel="stylesheet" href="../css/index.css" /> <link rel="stylesheet" href="../css/share.css" /> <style> html, body { background: #ffffff; } .proinfor .headblock { margin: 0 2% 4px 0; } .proinfor .headblock .headimg { max-width: 64px; width: 64px; overflow: hidden; margin: auto; } .proinfor .media-body { width: 76%; } .listtit { font-size: 15px; line-height: 26px; color: #333333; } .listtit2 { font-size: 13px; line-height: 20px; color: #666666; } .listtit3 { font-size: 12px; line-height: 18px; color: #888888; } @media only screen and (min-width: 100px) and (max-width: 350px) { .proinfor .media-body { width: 70%; } } </style> </head> <body> <div style="display:none"> <img id="hiddenImg" src="http://www.ekexiu.com/images/logo180.png" width="100%" /> </div> <div class="contentBody2"> <div class="art_topicBox"> <div class="art_img" id="articleImg"></div> <div class="art_tbox"> <h4 id="artical_topic"></h4> </div> </div> <div class="articalBox"> <ul id="proInfor"> <li style="padding:8px 20px 8px 10px;"> <a class="proinfor clearfix"> <div class="headblock floatL"><img id="proHead" class="headimg userRadius" src="../images/default-photo.jpg"></div> <div class="media-body floatL"> <span class="listtit"><span id="proName"></span><em class="authiconNew authicon-pro" title="科袖认证专家"></em></span> <div class="listtit2" id="oMess"></div> <div class="mui-ellipsis listtit3" id="proRlist"></div> <div class="mui-ellipsis listtit3" id="proZlist"></div> </div> </a> </li> </ul> <div class="line01" style="margin:4px 0 10px 0;"></div> <div id="artical_real"> <!--body--> <div id="main_content"> </div> <!--body--> </div> <div class="blockGroup mainbox" style="padding-bottom:40px;"> <div class="maincon alignCenter"> <div style="margin-top: 30px;"><span style="color:#ff9900; font-size: 16px;line-height: 32px;">「 科袖 」</span><br />搭建企业与专家的桥梁</div> <div class="frmbox" style="margin:20px auto;"> <a href="http://a.app.qq.com/o/simple.jsp?pkgname=com.ekexiu.app"><button class="frmbtn frmactive">下载移动客户端</button></a> </div> <div> <img style="width:120px;" src="../images/weixin_code.jpg" /> <div style="color:#CCCCCC;font-size:13px;">关注科袖公众号</div> </div> </div> </div> </div> </div> <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> <script type="text/javascript" src="../js/jquery-1.11.1.js"></script> <script> $(document).ready(function() { var imgUrl = "http://www.ekexiu.com/images/logo180.png"; var lineLink = document.location.href; var descContent; var shareTitle; var appid = ''; var articleId = GetQueryString("articleId"); function GetQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var r = window.location.search.substr(1).match(reg); var context = ""; if(r != null) context = r[2]; reg = null; r = null; return context == null || context == "" || context == "undefined" ? "" : decodeURI(context); } function proInfoMain() { $.ajax({ url: "/ajax/article/query", dataType: 'json', //数据格式类型 type: 'GET', //http请求类型 async: false, data: { "articleId": articleId }, timeout: 10000, //超时设置 success: function(data) { console.log(data) var $info = data.data || {}; if(data.success && data.data) { //var nameli = document.getElementById("nameli"); /*var proZlist = document.getElementById("proZlist"); //专家资源 var proRlist = document.getElementById("proRlist"); //专家资源 var proName = document.getElementById("proName"); var proTitle = document.getElementById("proTitle"); var proOffice = document.getElementById("proOffice"); var proOrg = document.getElementById("proOrg"); var proAddress = document.getElementById("proAddress");*/ var articleImg = document.getElementById("articleImg"); var artical_topic = document.getElementById("artical_topic"); var main_content = document.getElementById("main_content"); var hiddenImg = document.getElementById("hiddenImg"); //隐藏文章头图位置 //proName.innerText = $info.professor.name; if($info.articleType==1){ professor($info.professorId); }else{ company($info.orgId) } if($info.articleImg) { articleImg.style.backgroundImage = 'url(/data/article/' + $info.articleImg + ')'; //hiddenImg.src = '/data/article/' + $info.articleImg + ''; //imgUrl = '/data/article/' + $info.articleImg + ''; } else { //imgUrl = 'http://www.ekexiu.com/images/logo180.png'; //alert(imgUrl); //articleImg.style.backgroundImage = 'url(../images/logo180.png)'; } /*if($info.professor.hasHeadImage) { document.getElementById('proHead').src = "/images/head/" + $info.professorId + "_l.jpg"; }*/ artical_topic.innerText = $info.articleTitle; //title标题栏 shareTitle = "【科袖文章】" + $info.articleTitle + ""; window.setInterval(function() { document.title = "【科袖文章】" + $info.articleTitle + ""; }, 500); if($info.articleContent) { main_content.innerHTML = $info.articleContent; descContent = main_content.innerText; var oImg = main_content.getElementsByTagName("img"); for(var i = 0; i < oImg.length; i++) { (function(n) { var att = oImg[n].src.substr(7); console.log(oImg[n].src) oImg[n].style.width = "100%"; oImg[n].parentNode.style.textIndent = "0em"; })(i); } } else { descContent = ""; } } }, error: function() { return; } }); } proInfoMain(); /*专家信息*/ function professor(dataUrl){ $.ajax({ url: "/ajax/professor/info/"+dataUrl, type: 'get', dataType: 'json', success: function(data) { if(data.success) { var $data=data.data; $("#proName").text($data.name); var omessage=personalInformation($data); $("#oMess").text(omessage); var oTime = $data["createTime"].substr(0, 4) + "年" + $data.createTime.substr(4, 2) + "月" + $data.createTime.substr(6, 2) + "日" ; $("#proRlist").html(oTime); if($data.hasHeadImage){ $("#proHead").attr("src","/images/head/" + $data.id + "_l.jpg") } /*var rlist = '' for(var n = 0; n < $data.researchAreas.length; n++) { rlist += '<span>' + $data.researchAreas[n].caption + '</span>'; if(n != $data.researchAreas.length - 1) { rlist += ','; } } ($data.researchAreas) ? $("#proRlist").html(rlist): $("#proRlist").html(""); var zlist = ""; for(var n = 0; n < $data.resources.length; n++) { zlist += '<span>' + $data.resources[n].resourceName + '</span>'; if(n != $data.resources.length - 1) { zlist += ','; } } ($data.resources) ? $("#proZlist").html(zlist) : $("#proZlist").html("");*/ } }, }); } /*企业信息*/ function company(dataUr){ $.ajax({ url: "/ajax/org/" + dataUr, type: "GET", timeout: 10000, dataType: "json", beforeSend: function() {}, success: function(data, textState) { if(data.success) { var $data = data.data; $("#proName").text($data.name); if($data.authStatus == 3) { $("em").replaceWith("<em class='authiconNew authicon-com-ok' title='认证企业'></em>"); } else { $("em").replaceWith(""); } if($data.hasOrgLogo) { $("#proHead").attr("src", "/images/org/" + $data.id + ".jpg"); } else { $("#proHead").attr("src", "images/default-icon.jpg"); } var oTime = $data["createTime"].substr(0, 4) + "年" + $data.createTime.substr(4, 2) + "月" + $data.createTime.substr(6, 2) + "日" ; $("#proRlist").html(oTime); } }, error: function(XMLHttpRequest, textStats, errorThrown) { $.MsgBox.Alert('提示', '服务器请求失败') } }) } /*职位职称所在机构,部门,地址等等*/ function personalInformation($person) { var arr1 = [$person.title, $person.office, $person.department, $person.orgName, $person.address]; var arr = new Array(); var arr2 = new Array(); var n = 0; for(var i = 0; i < arr1.length; i++) { if(arr1[i]) { arr.push(arr1[i]); if(arr1[i] == arr1[arr1.length - 1]) { n = 1; } } } if(n == 1) { for(var i = 0; i < arr.length - 1; i++) { arr2.push(arr[i]); } return arr2.join() + " | " + arr[arr.length - 1]; } else { return arr.join(); } } /*微信分享*/ $.ajax({ url: "../ajax/weixin/jsapiTicket", type: 'get', dataType: 'json', contentType: "application/x-www-form-urlencoded; charset=utf-8", data: { 'url': location.href.split('#')[0] }, success: function(data) { if(data.data) { wx.config({ debug: false, //调试模式好犀利 appId: data.data.appId, timestamp: data.data.timestamp, nonceStr: data.data.nonceStr, signature: data.data.signature, jsApiList: [ // 所有要调用的 API 都要加到这个列表中 "onMenuShareAppMessage", "onMenuShareTimeline", "onMenuShareQQ", "onMenuShareQZone", "scanQRCode", ] }); wx.ready(function() { // 在这里调用 API wx.onMenuShareAppMessage({ //分享给朋友 title: shareTitle, // 分享标题 desc: descContent, // 分享描述 link: lineLink, // 分享链接 imgUrl: imgUrl, // 分享图标 success: share_success_callback, cancel: share_cancel_callback }); wx.onMenuShareTimeline({ //分享到朋友圈 title: shareTitle, // 分享标题 desc: descContent, // 分享描述 link: lineLink, // 分享链接 imgUrl: imgUrl, // 分享图标 success: share_success_callback, cancel: share_cancel_callback }); wx.onMenuShareQQ({ //分享到QQ title: shareTitle, // 分享标题 desc: descContent, // 分享描述 link: lineLink, // 分享链接 imgUrl: imgUrl, // 分享图标 success: share_success_callback, cancel: share_cancel_callback }); wx.onMenuShareQZone({ //分享到QQ空间 title: shareTitle, // 分享标题 desc: descContent, // 分享描述 link: lineLink, // 分享链接 imgUrl: imgUrl, // 分享图标 success: share_success_callback, cancel: share_cancel_callback }); }); //分享成功后的回调函数 function share_success_callback() {} //用户取消分享后执行的回调函数 function share_cancel_callback() {} } } }); }) </script> </body> </html>