$(...).Jcrop 不是函数

Posted 2023-02-25

【中文标题】$(...).Jcrop 不是函数

【英文标题】：$(...).Jcrop is not a function

【发布时间】：2018-11-19 11:43:34

【问题描述】：

我已经阅读了关于

的文章

'$(...)Jcrop 不是函数'。

我已确保我没有包含两次 Jcrop 链接。

JCrop 似乎给我带来了麻烦

有人可以帮忙吗。

html

<link rel="stylesheet" type="text/css" href="styles.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.Jcrop.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/jquery.Jcrop.min.css" />

    <div class="profile-pic">
        <label>Profile Pic</label>
        <input type="file" name="profile_pic" id="profile-pic-input">
        <img src="images/volunteer.jpg" id="profile-pic">
    </div>

查询：

$(document).ready(function()
    $('#profile-pic-input').change(function()
        readURLProfile(this);
    );

    $('#profile-pic-input').change(function()
        $('#profile-pic').Jcrop();
    );

    function readURLProfile(input) 
        if(input.files&&input.files[0]) 
            var reader = new FileReader();
            reader.onload=function(e) 
                $('#profile-pic').attr('src',e.target.result);
            
            reader.readAsDataURL(input.files[0]);
        
    
);

【问题讨论】：

您是否检查过 jcrop 文件实际上是否正确加载到您的页面中（例如，您可能为它提供了不正确的 URL）？

我问是因为，如果您包含指向 jCrop 文件的有效链接，那么您的代码似乎不会引发任何错误。演示：jsfiddle.net/avx3wdfm

感谢您的回复。我又检查了一遍。该链接似乎正确。只有在我自动填充图像后，我才会收到错误“$(...).Jcrop is not a function”

“似乎正确”...或者是正确？您是否真的通过浏览器的开发工具检查了它是否正确加载？打开开发者工具（在大多数浏览器中按 F12）...转到“网络”部分....现在刷新您的页面（在大多数浏览器中按 F5）...观看网络工具...您会看到“js/jquery.Jcrop.min.js”的一行......它是否返回 200 OK 响应？如果它没有加载，那么 jQuery 将不知道 Jcrop 函数，这将导致您看到的错误。

是的。照你说的做了。它显示 200 处于状态。

【参考方案1】：

问题是我在页脚处运行了另一个 jquery 脚本实例，这引发了错误。很抱歉造成混乱。