2013-02-09 102 views
8

遗漏的类型错误的“dropEffect来”:未定义main.js不能设置属性“dropEffect来”
遗漏的类型错误:无法读取的不确定
拖放doenst不起作用:未定义

财产“文件”什么是错的这里

.coffee

$ -> 
    app = new Viewr 

class Viewr 

    constructor:() -> 
    $('#drop_zone') 
    .bind('dragover', @handleDragOver) 
    .bind('drop', @handleDrop) 

    handleDrop: (evt) -> 
    evt.stopPropagation() 
    evt.preventDefault() 
    files = evt.dataTransfer.files 

    @setActiveImage files[0] 

    handleDragOver: (evt) -> 
    evt.stopPropagation() 
    evt.preventDefault() 
    evt.dataTransfer.dropEffect = "copy" 

    setActiveImage: (image)-> 
    $("img").attr "src", src 

.HTML

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <link rel="stylesheet" type="text/css" href="css/main.css"> 
</head> 
<body> 
    <div id="drop_zone" style="width: 100px; height: 100px; border: 2px dashed #bbb; 
           -moz-border-radius: 5px; 
           -webkit-border-radius: 5px; 
           border-radius: 5px; 
           padding: 25px; 
           text-align: center; 
           color: #bbb;">Drop files here</div> 
</body> 
<script type="text/javascript" src="js/lib/jquery-1.9.1.min.js"></script> 
<script type="text/javascript" src="js/main.js"></script> 
</html> 

回答

28

我认为问题可能在于您使用的是jQuery 'dragover''drop'事件,而不是本机放置事件。正如你所看到here,它提到不必dataTransfer对象添加到jQuery的事件对象:

OtherProperties

Certain events may have properties specific to them. Those can be accessed as properties of the event.originalEvent object. To make special properties available in all event objects, they can be added to the jQuery.event.props array. This is not recommended, since it adds overhead to every event delivered by jQuery.

Example:

// add the dataTransfer property for use with the native `drop` event 
// to capture information about files dropped into the browser window 
jQuery.event.props.push("dataTransfer"); 

您最好的选择可能是访问originalEvent对象,所以看看,如果这个工程:

handleDrop: (evt) -> 
    evt.stopPropagation() 
    evt.preventDefault() 
    files = evt.originalEvent.dataTransfer.files 

handleDragOver: (evt) -> 
    evt.stopPropagation() 
    evt.preventDefault() 
    evt.originalEvent.dataTransfer.dropEffect = "copy"