Uncaught TypeError: $ (...). Cropper не является функцией - cropper. js - PullRequest
0 голосов
/ 14 января 2020

Я попробовал учебник по этой ссылке

Мой код

<!DOCTYPE html>
<html>
<head>    
<link href="cropper.css" rel="stylesheet" />
</head>
<body>
<img id="teh" src="image.png" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="cropper.js"></script>
<script>        
    $("#teh").cropper();
</script>
</body>
</html>

Но, он попадает в ошибку Uncaught TypeError: $(...).cropper is not a function при $("#teh").cropper();

Ответы [ 2 ]

1 голос
/ 14 января 2020

Я думаю, что вы используете jQuery новую версию, пока она поддерживает старую версию.

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);
  }
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/0.8.0/cropper.min.css" rel="stylesheet"/>
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/0.8.0/cropper.min.js"></script>

<img id="image" src="https://lh5.googleusercontent.com/-_nU33sjf1SI/AAAAAAAAAAI/AAAAAAAASgQ/VOkKnOIxP8g/photo.jpg?sz=328" />
0 голосов
/ 14 января 2020

Нашел решение уже. Мне нужно добавить

<script src="jquery-cropper.js"></script>

так, это становится

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="cropper.js"></script>
<script src="jquery-cropper.js"></script>
...