>  기사  >  웹 프론트엔드  >  JavaScript로 첨부파일 미리보기 기능을 구현하는 코드 소개

JavaScript로 첨부파일 미리보기 기능을 구현하는 코드 소개

巴扎黑
巴扎黑원래의
2017-08-18 09:55:261633검색

이 글은 주로 JavaScript의 첨부파일 미리보기 기능 구현을 소개합니다. 구체적인 작업 단계는 아래에서 자세히 확인할 수 있습니다.

회사의 EMP 이미징 플랫폼은 상대적으로 번거롭고 미리보기 전에 다운로드해야 하기 때문에 비즈니스 직원은 첨부파일 목록 페이지에 미리보기 페이지를 추가하자고 제안했습니다. 오늘은 완성된 과정을 기록하겠습니다.

하나는 js 버전이고, 다른 하나는 jquery 버전입니다. 여기서는 js 버전을 사용합니다. jquery 버전은 약간 다르게 도입되었습니다.

1. 플러그인 소개(업로드됨)

95f58c7bd49d13940525534480183e84db271416853c42fd247a57c1a2c29eb6

5a1abd745f0061c9a46e802a4aa9584b 사진 미리보기 시 여러 장을 선택하거나 선택하지 않은 사진을 선택할 수 있습니다. 선택하지 않으면 기본적으로 이 목록의 모든 사진이 표시됩니다. 체크하면 선택한 사진이 표시됩니다. . 여기에서 APP가 많은 압축된 사진 패키지를 업로드한 것을 발견했습니다. 따라서 *.zip 및 *.rar의 자동 압축 해제 기능이 백그라운드에 추가되었습니다. 이 부분에서는 1.6만 지원하는 타사 jar 패키지가 필요합니다. *.zip 형식의 압축 풀기 및 가장 당황스러운 Sun 회사 기본 인코딩, 중국어가 있는 경우 오류가 보고되며, jdk1.7

import java.io.* import java; .util.ArrayList;import java.util.Enumeration;

import java.util.List;

import org.apache .tools.zip.ZipEntry;
import org.apache.tools.zip.ZipFile;

import com.yucheng .cmis.eration.CMISOperation;

import com.github.junrar.Archive;

import com.github.junrar.rarfile .FileHeader;




3. 압축이 풀린 파일의 비동기 삭제



공유 디스크의 공간을 차지하면 압축 해제 후 비동기 삭제가 이루어집니다. 시간은 20초 이후로 충분하지만, 20초 이후에 클릭하여 페이지를 다시 로드하면 이미지에 대한 경로가 있으므로 이미지가 로드되지 않습니다. 만료되었습니다.

<SCRIPT>
var attach_path= &#39;${param.attach_path}&#39;;
var attach_name= decodeURI(&#39;${param.attach_name}&#39;);
var attachPath= new Array();
attachName=attach_name.split(",");
var attachPath1= new Array();
attachPath1=attach_path.split(",");
for (var i=0;i<attachPath1.length;i++)
{ 
 attachPath2=&#39;102storage&#39;+attachPath1[i];
 $("#jq22").append("<li><img alt=&#39;"+attachName[i]+"&#39; src=&#39;"+attachPath2+"&#39;></li>"); 
}
$(function() {
 $(&#39;#jq22&#39;).viewer({
  url: &#39;src&#39;,
 });
});
</SCRIPT>

4. 디스크 마운팅

이미지 표시 시 프로젝트가 생각하는 이미지 경로에 페이지가 접근할 수 없기 때문에 해당 이미지 아래의 공유 디스크 경로를 마운트하려면 mount 명령을 실행해야 합니다. 특정 경로

mount --bind /testshare01 /app/cmis/project/cmis.war/ff/testshare01

이렇게 하면 정상적으로 표시될 수 있습니다

위 내용은 JavaScript로 첨부파일 미리보기 기능을 구현하는 코드 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.