Question

我正在尝试在网站上包含cloudinary的jquery小部件，以便客户端能够在上传之前裁剪图像。（基本上是个人资料照片）。我已将以下代码添加到页面中：

$('#upload_widget_opener').cloudinary_upload_widget(
{ cloud_name: 'moin-qidwai-me', upload_preset: 'zn7qhrdi' ,'form':'#profile-setting',
'field_name':'userPhoto', 'thumbnails':'#user_photo', cropping: 'server', 'folder':
'user_photos' },
function(error, result) { console.log(error, result) });

我正在测试一些内容，因此我对此代码进行了评论，当我取消注释时，它显然停止了woking并给了我这个错误：

 Uncaught InvalidStateError: Failed to set the 'value' property on 'HTMLInputElement': This input element accepts a filename, which may only be programmatically set to the empty string.

我现在通过undos将整个文件放在相同的状态，就像在评论之前那样，所以它不能是我在评论之后做的任何事情，但那就是它让它变得如此奇怪。

另一个问题是，即使它正在工作它是添加一个隐藏类型的输入字段，有没有办法我可以获取上传的图像的网址，并将我自己的输入字段的值设置为该网址？

Answer 1

这些天，我也遇到了同样的错误。我的代码片段：

<input id="fileDialog" type="file"/> 

var chooser = document.querySelector('#fileDialog');
var choosed_file_path = ""; 
chooser.addEventListener("change", function(evt) {   
    //$("#fileDialog").val(this.value);  // error
    choosed_file_path = this.value;
}, false);

不允许设置＆＃34;输入＆＃34;的值。

Answer 2

您可以在加载页面时查看控制台（在Developer工具下）是否包含任何JS错误吗？当缺少JS文件包时，可能会发生这种情况。

Answer 3

我通过为PHP / GD制作自定义裁剪工具并使用javascript / Jquery作为前端内容解决了这个问题。

如果有人偶然发现这个问题并需要更多帮助，请告诉我。

使用Jquery的Cloudinary上传小部件“无法在'HTMLInputElement'上设置'value'属性”

3 个答案: