项目开发中JS应用使用方法总结
Posted lijl
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了项目开发中JS应用使用方法总结相关的知识,希望对你有一定的参考价值。
一、获取当前网址:
function getRootPath() { //获取当前网址,如: http://localhost:8083/uimcardprj/share/meun.jsp var curWwwPath = window.document.location.href; //获取主机地址之后的目录,如: /uimcardprj/share/meun.jsp var pathName = window.document.location.pathname; var pos = curWwwPath.indexOf(pathName); //获取主机地址,如: http://localhost:8083 var localhostPaht = curWwwPath.substring(0, pos); return localhostPaht; }
二、打开新浏览器页面文件:
//打开PDF格式的出差文件报告 function pdfShow(pdfPath) { //获取主机地址+文件地址 var url=getRootPath() + "/" + pdfPath; window.open(url, "_blank", "scrollbars=yes,resizable=1,modal=false,alwaysRaised=yes"); }
三、获取url传递的参数:
//获取url传递的参数 function GetRequest() { var url = location.search; //获取url中"?"符后的字串 var theRequest = new Object(); if (url.indexOf("?") != -1) { var str = url.substr(1); strs = str.split("&"); for (var i = 0; i < strs.length; i++) { theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]); } } return theRequest; }
四、计算两个日期相隔天数:
//计算两个日期相隔天数 function getDays(strDateStart, strDateEnd) { var strSeparator = "-"; //日期分隔符 var oDate1; var oDate2; var iDays; oDate1 = strDateStart.split(strSeparator); oDate2 = strDateEnd.split(strSeparator); var strDateS = new Date(oDate1[0], oDate1[1] - 1, oDate1[2]); var strDateE = new Date(oDate2[0], oDate2[1] - 1, oDate2[2]); iDays = parseInt(Math.abs(strDateS - strDateE) / 1000 / 60 / 60 / 24)//把相差的毫秒数转换为天数 return iDays + 1; }
五、文件上传带参数(可多个参数),返回值改成json格式:
//文件上传带参数,返回值改成json格式 jQuery.extend({ createUploadIframe: function (id, uri) { //create frame var frameId = ‘jUploadFrame‘ + id; if (window.ActiveXObject) { var io = document.createElement(‘<iframe id="‘ + frameId + ‘" name="‘ + frameId + ‘" />‘); if (typeof uri == ‘boolean‘) { io.src = ‘javascript:false‘; } else if (typeof uri == ‘string‘) { io.src = uri; } } else { var io = document.createElement(‘iframe‘); io.id = frameId; io.name = frameId; } io.style.position = ‘absolute‘; io.style.top = ‘-1000px‘; io.style.left = ‘-1000px‘; document.body.appendChild(io); return io }, createUploadForm: function (id, fileElementId, data) { //create form var formId = ‘jUploadForm‘ + id; var fileId = ‘jUploadFile‘ + id; var form = $(‘<form action="" method="POST" name="‘ + formId + ‘" id="‘ + formId + ‘" enctype="multipart/form-data"></form>‘); //var oldElement = $(‘#‘ + fileElementId); //var newElement = $(oldElement).clone(); //$(oldElement).attr(‘id‘, fileId); //$(oldElement).before(newElement); //$(oldElement).appendTo(form); for (var i = 0; i < fileElementId.length; i++) { var oldElement = jQuery(‘#‘ + fileElementId[i]); var newElement = jQuery(oldElement).clone(); jQuery(oldElement).attr(‘id‘, fileElementId[i]); jQuery(oldElement).attr(‘name‘, fileElementId[i]); jQuery(oldElement).before(newElement); jQuery(oldElement).appendTo(form); } //<span style="color:#ff0000;">增加文本参数的支持,修改本处,本处应有掌声 </span> if (data) { for (var i in data) { var temp = $(‘<input type="hidden" name="‘ + i + ‘" />‘); temp.val(data[i]); temp.appendTo(form); } } //set attributes $(form).css(‘position‘, ‘absolute‘); $(form).css(‘top‘, ‘-1200px‘); $(form).css(‘left‘, ‘-1200px‘); $(form).appendTo(‘body‘); return form; }, ajaxFileUpload: function (s) { // TODO introduce global settings, allowing the client to modify them for all requests, not only timeout s = jQuery.extend({}, jQuery.ajaxSettings, s); var id = new Date().getTime() var form = jQuery.createUploadForm(id, s.fileElementId, s.data); var io = jQuery.createUploadIframe(id, s.secureuri); var frameId = ‘jUploadFrame‘ + id; var formId = ‘jUploadForm‘ + id; // Watch for a new set of requests if (s.global && !jQuery.active++) { jQuery.event.trigger("ajaxStart"); } var requestDone = false; // Create the request object var xml = {} if (s.global) jQuery.event.trigger("ajaxSend", [xml, s]); // Wait for a response to come back var uploadCallback = function (isTimeout) { var io = document.getElementById(frameId); try { if (io.contentWindow) { xml.responseText = io.contentWindow.document.body ? io.contentWindow.document.body.innerhtml : null; xml.responseXML = io.contentWindow.document.XMLDocument ? io.contentWindow.document.XMLDocument : io.contentWindow.document; } else if (io.contentDocument) { xml.responseText = io.contentDocument.document.body ? io.contentDocument.document.body.innerHTML : null; xml.responseXML = io.contentDocument.document.XMLDocument ? io.contentDocument.document.XMLDocument : io.contentDocument.document; } } catch (e) { jQuery.handleError(s, xml, null, e); } if (xml || isTimeout == "timeout") { requestDone = true; var status; try { status = isTimeout != "timeout" ? "success" : "error"; // Make sure that the request was successful or notmodified if (status != "error") { // process the data (runs the xml through httpData regardless of callback) var data = jQuery.uploadHttpData(xml, s.dataType); // If a local callback was specified, fire it and pass it the data if (s.success) s.success(data, status); // Fire the global callback if (s.global) jQuery.event.trigger("ajaxSuccess", [xml, s]); } else jQuery.handleError(s, xml, status); } catch (e) { status = "error"; jQuery.handleError(s, xml, status, e); } // The request was completed if (s.global) jQuery.event.trigger("ajaxComplete", [xml, s]); // Handle the global AJAX counter if (s.global && ! --jQuery.active) jQuery.event.trigger("ajaxStop"); // Process result if (s.complete) s.complete(xml, status); jQuery(io).unbind() setTimeout(function () { try { $(io).remove(); $(form).remove(); } catch (e) { jQuery.handleError(s, xml, null, e); } }, 100) xml = null } } // Timeout checker if (s.timeout > 0) { setTimeout(function () { // Check to see if the request is still happening if (!requestDone) uploadCallback("timeout"); }, s.timeout); } try { // var io = $(‘#‘ + frameId); var form = $(‘#‘ + formId); $(form).attr(‘action‘, s.url); $(form).attr(‘method‘, ‘POST‘); $(form).attr(‘target‘, frameId); if (form.encoding) { form.encoding = ‘multipart/form-data‘; } else { form.enctype = ‘multipart/form-data‘; } $(form).submit(); } catch (e) { jQuery.handleError(s, xml, null, e); } if (window.attachEvent) { document.getElementById(frameId).attachEvent(‘onload‘, uploadCallback); } else { document.getElementById(frameId).addEventListener(‘load‘, uploadCallback, false); } return { abort: function () { } }; }, uploadHttpData: function (r, type) { /*源代码 var data = !type; data = type == "xml" || data ? r.responseXML : r.responseText; // If the type is "script", eval it in global context if (type == "script") jQuery.globalEval(data); // Get the JavaScript object, if JSON is used. if (type == "json") eval("data = " + data); // evaluate scripts within html if (type == "html") jQuery("<div>").html(data).evalScripts(); //alert($(‘param‘, data).each(function(){alert($(this).attr(‘value‘));})); return data; */ //返回格式给成json var data = r.responseText; var start = data.indexOf("{"); var end = data.indexOf("}"); var jsonStr = data.substring(start, end + 1); return (jsonStr instanceof Object) ? jsonStr : eval("(" + jsonStr + ")"); } })
六、调用,文件上传带参数(可多个参数),返回值改成json格式:
$.ajaxFileUpload({ type: "POST", contentType: false, enctype: "multipart/form-data", url: "/UserManager/SaveUser", data: {userModel: JSON.stringify(userModel), user_list: JSON.stringify(user_list), travelVisitSchedule_list:}, secureuri: false, fileElementId: [file1‘,‘file2‘], dataType: ‘json‘, async: false, success: function (data) { if (data.IsSuccess) { $.messager.alert(‘操作提示‘, data.Message, ‘info‘); } else { $.messager.alert(‘操作提示‘, data.Message, ‘info‘); } } });
七、
以上是关于项目开发中JS应用使用方法总结的主要内容,如果未能解决你的问题,请参考以下文章