js获取url中get传参以及预览图片等...几个

    xiaoxiao2022-06-29  69

    1.js获取url中get方式传输的参数:

    //获取url中get方式传的参数 function getPar(par){ //比如获取id xxx.html?id=100 var local_url = document.location.href; //获取要取得的get参数位置 var get = local_url.indexOf(par + "="); if(get == -1) { return false; }else{ //截取字符串 var get_par = local_url.slice(par.length + get + 1); //判断截取后的字符串是否还有其他get参数 var nextPar = get_par.indexOf("&"); if (nextPar != -1) { get_par = get_par.slice(0, nextPar); } return get_par; } } 2.js根据文件路径获取文件名字:

    <script type="text/javascript"> var fullFilename = "C:\\高拍仪图片\\test.png"; var filenameArray = fullFilename.split('\\'); var filename = filenameArray[filenameArray.length-1]; console.log(filename); </script>

    3.js预览本地图片:

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js预览本地图片</title> <link rel="stylesheet" type="text/css" href="bootstrap.min.css"/> </head> <style> .imgBig{ width: 500px; height: 500px; position: fixed; top: 100px; bottom: 0; left: 500px; z-index: 1040; background-color: #828282; opacity: .5; } #toBigImg{ max-width: 100%; max-height: 100%; } .imgclose{ float: right; left: 14px; top: -10px; position: relative; } </style> <body> <form action=""> <input type="file" name="imgOne" id="imgOne" οnchange="preImg(this.id,'imgPre');" /> <img id="imgPre" src="" width="300px" height="300px" style="display: block;" /> </form> </br> <div class="imgBig"> <img class="imgclose" src="images/close_link.png" /> <img id="toBigImg" src="" /> </div> <button οnclick="scaleBig()">放大</button> <script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="bootstrap.min.js"></script> <script type="text/javascript"> /** * 从 file 域获取 本地图片 url */ function getFileUrl(sourceId) { var url; if (navigator.userAgent.indexOf("MSIE")>=1) { // IE url = document.getElementById(sourceId).value; } else if(navigator.userAgent.indexOf("Firefox")>0) { // Firefox url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0)); } else if(navigator.userAgent.indexOf("Chrome")>0) { // Chrome url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0)); } return url; } /** * 将本地图片 显示到浏览器上 */ function preImg(sourceId, targetId) { var url = getFileUrl(sourceId); var imgPre = document.getElementById(targetId); imgPre.src = url; } /* 方法图片 */ function scaleBig(){ var oldimg = document.getElementById("imgPre"); var bigimg = document.getElementById("toBigImg"); bigimg.src = oldimg.src; } </script> </body> </html>

    转载请注明原文地址: https://ju.6miu.com/read-1125014.html

    最新回复(0)