cropper.jsの初期化中にエラーが発生しました

私はreadmeページのすべての手順に従っていますが、最初にエラーが発生しました未知のReferenceError：Cropperはクロッパーがコンストラクタない.butこの方法でのみ、彼らはオプションを渡している：私は VARクロッパー= window.Cropper statement.when私は別のエラー捕捉されない例外TypeErrorを持ってページをリロード追加した.soのを定義していませんCropperのコンストラクタに何が間違っているのか分かりませんでしたcropper.jsの初期化中にエラーが発生しました

<!doctype html> 
<html lang="en"> 
<head> 
    <title>Cropper</title> 
    <link rel="stylesheet" href="../dist/cropper.css"> 
    <style> 
    img { 
     max-width: 100%; 
    } 
    </style> 
</head> 
<body> 

    <div> 
    <img id="image" src="wallpaper.jpg"> 
    </div> 

    <div id="preview" ></div> 

    <!-- Scripts --> 
    <script src="../assets/js/jquery.min.js"></script> 
    <script src="../dist/cropper.js"></script> 
    <script> 
     var Cropper = window.Cropper; 
     var image = document.getElementById('image'); 
     var cropper = new Cropper(image, { 
     aspectRatio: 16/9, 
     crop: function(e) { 
      console.log(e.detail.x); 
      console.log(e.detail.y); 
      console.log(e.detail.width); 
      console.log(e.detail.height); 
      console.log(e.detail.rotate); 
      console.log(e.detail.scaleX); 
      console.log(e.detail.scaleY); 
     } 
     }); 
    </script> 
</body> 
</html>

出典

2016-05-27 codegeek

あなたには 'cropper.js'ファイルが含まれていません。ファイルが本当に../ dist/cropper.jsにあることは確実ですか？ – DelightedD0D

あなたがCropperの例に提供したリンクでは、グローバルな「Cropper」オブジェクトも表示されないので、方法もそこでは失敗します。ドキュメントを少しずつ読んでみることをお勧めします。 – Robusto

彼らはWindow.cropperのようなクロッパーを初期化するように頼んでいます – codegeek

Cropperは（Cropper.jsと混同しないように）あなたはこのようなjQueryオブジェクトを通してそれを使用する必要があるので、jQueryを使って動作するように意図されています

var image = $('#image'); 
    var cropper = image.cropper({ 
    aspectRatio: 16/9, 
    crop: function(e) { 
     console.log(e.x); 
     console.log(e.y); 
     console.log(e.width); 
     console.log(e.height); 
     console.log(e.rotate); 
     console.log(e.scaleX); 
     console.log(e.scaleY); 
    } 
    });

$（「＃イメージ」）はかなりありますdocument.getElementById（ 'image'）と同じことですが、画像要素をjQueryオブジェクトとして返します。このオブジェクトには多くの便利なメソッドがあります。 Cropper.jsのような多くのプラグインは、jQueryオブジェクトに独自のメソッドを追加して使いやすくしています。

出典

2016-05-27 04:45:10

こんにちは@peter、私は上記のsuggestion.butのようなコードを実行します。私はエラーを取得できませんでした未定義のプロパティ 'x'を読むことができません – codegeek

おっと。申し訳ありません。 .detailの部品を取り出すだけです。私は私の答えを編集しました。 –

ありがとうpeter that – codegeek

cropper.jsの初期化中にエラーが発生しました

答えて

関連する問題