8

キャッチされていない TypeError:未定義の main.js のプロパティ 'dropEffect' を設定できません キャッチされていない
TypeError: 未定義のプロパティ 'files' を読み取れません

ここで何が問題なのですか

。コーヒー

$ ->
  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>
4

1 に答える 1

31

問題は、ネイティブのドロップ イベントではなく、jQuery'dragover'とイベントを使用している可能性があると思います。ここ'drop'でわかるように、DataTransfer オブジェクトを jQuery イベント オブジェクトに追加する必要があることが言及されています。

その他のプロパティ

特定のイベントには、それらに固有のプロパティがある場合があります。これらは、event.originalEvent オブジェクトのプロパティとしてアクセスできます。すべてのイベント オブジェクトで特別なプロパティを使用できるようにするには、それらを jQuery.event.props 配列に追加します。jQuery によって配信されるすべてのイベントにオーバーヘッドが追加されるため、これはお勧めできません。

例：

// 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"
于 2013-02-09T22:12:49.913 に答える