HTML5에서는 드래그된 데이터를 드래그할 때 dropzone 속성을 복사, 이동 또는 링크할지 여부를 지정합니다.

예

드래그 데이터는 드래그된 데이터의 복사본을 생성합니다.

<div dropzone="copy"></div>

브라우저 지원

현재 모든 주요 브라우저는 드롭존 속성을 지원하지 않습니다.

정의 및 사용법

dropzone 속성은 요소에 데이터를 드래그할 때 드래그한 데이터를 복사, 이동 또는 링크할지 여부를 지정합니다.

HTML 4.01과 HTML5의 차이점

dropzone 속성은 HTML5의 새로운 기능입니다.

Syntax

<element dropzone="copy|move|link">

속성 값

Value	Description
copy	드래그 데이터는 드래그된 데이터의 복사본을 생성합니다.
move	데이터를 드래그하면 드래그된 데이터가 새로운 위치로 이동됩니다.
link	데이터를 드래그하면 원본 데이터에 대한 링크가 생성됩니다.

dropzone을 사용하는 일반적인 방법은 클래스 속성

<form action="/file-upload"
      class="dropzone"
      id="my-awesome-dropzone"></form>

<script>var myDropzone = new Dropzone("div#myId", { url: "/file/post"});</script>

Case

$("#dropz").dropzone({
        url: "index.php", //必须填写
        method:"post",  //也可用put
        paramName:"Filedata", //默认为file
        maxFiles:10,//一次性上传的文件数量上限
        maxFilesize: 20, //MB
        acceptedFiles: ".jpg,.gif,.png", //上传的类型
        previewsContainer:"#adds", //显示的容器
        parallelUploads: 3,
        dictMaxFilesExceeded: "您最多只能上传10个文件！",
        dictResponseError: '文件上传失败!',
        dictInvalidFileType: "你不能上传该类型文件,文件类型只能是*.jpg,*.gif,*.png。",
        dictFallbackMessage:"浏览器不受支持",
        dictFileTooBig:"文件过大上传文件最大支持.",
        previewTemplate: document.querySelector('#preview-template').innerHTML,//设置显示模板
        init:function(){
            this.on("addedfile", function(file) { 
            //上传文件时触发的事件
            });            this.on("queuecomplete",function(file) {
                //上传完成后触发的方法
            });            this.on("removedfile",function(file){
                //删除文件时触发的方法
                 });
            });
        }

    });

에 dropzone을 포함하는 양식 요소를 만드는 것입니다.

위 내용은 HTML5에서는 드래그된 데이터를 드래그할 때 dropzone 속성을 복사, 이동 또는 링크할지 여부를 지정합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!