（我会再解释一次我的问题）
我在互联网上找到了一个脚本，你可以在这个链接中看到：
Link
但是我不能改变我想要的代码。
脚本开始工作的图像上传，但我会使用定义的图像。代码必须开始与定义的图像。
例如：abc.jpg
如果我进入页面或者点击一个链接，模型就会打开。abc.jpg也会被裁剪。我没有足够的jquery和jscript信息。
我想我必须改变这个代码，它是在下面，但我不能改变。
如果你帮我，我会很感激

<script>

$(document).ready(function(){

    var $modal = $('#modal');

    var image = document.getElementById('sample_image');

    var cropper;

    $('#upload_image').change(function(event){
        var files = event.target.files;

        var done = function(url){
            image.src = url;
            $modal.modal('show');
        };

        if(files && files.length > 0)
        {
            reader = new FileReader();
            reader.onload = function(event)
            {
                done(reader.result);
            };
            reader.readAsDataURL(files[0]);
        }
    });

    $modal.on('shown.bs.modal', function() {
        cropper = new Cropper(image, {
            aspectRatio: 1,
            viewMode: 3,
            preview:'.preview'
        });
    }).on('hidden.bs.modal', function(){
        cropper.destroy();
        cropper = null;
    });

    $('#crop').click(function(){
        canvas = cropper.getCroppedCanvas({
            width:400,
            height:400
        });

        canvas.toBlob(function(blob){
            url = URL.createObjectURL(blob);
            var reader = new FileReader();
            reader.readAsDataURL(blob);
            reader.onloadend = function(){
                var base64data = reader.result;
                $.ajax({
                    url:'upload.php',
                    method:'POST',
                    data:{image:base64data},
                    success:function(data)
                    {
                        $modal.modal('hide');
                        $('#uploaded_image').attr('src', data);
                    }
                });
            };
        });
    });
    
});
</script>

字符串
我试了很多次：

$('#upload_image').change(function(event){

型
相反

$("#abc").click(function(){

型
但它没有工作