首先,我知道有很多问题与这个问题有关。但问题是,它们都与jquery有某种关联。
但我的问题实现了普通javascript。
基本上,除了onselect()之外,其他一切都正常工作。我无法获取附件的URL。
Here is the code.
var custom_uploader;
var uploadButton = document.getElementById(\'upload_logo_button\');
uploadButton.addEventListener("click", function(e) {
e.preventDefault();
if ( custom_uploader ) {
custom_uploader.open();
return;
}
custom_uploader = wp.media.frames.file_frame = wp.media({
frame: \'select\',
title: \'Choose Image\',
button: {
text: \'Select Image\'
},
multiple: false
});
custom_uploader.onselect = function() {
var attachment = custom_uploader.state().get(\'selection\').first().toJSON();
console.log(attachment);
var uploadLogoImage = document.getElementById("upload_image").innerHTML(attachment.url);
}
//Open the uploader dialog
custom_uploader.open();
});
请有人告诉我为什么我无法获得图像的URL,即使图像成功上传到WP媒体。提前谢谢。如果有人需要更多信息,请随时询问。再次感谢。
最合适的回答,由SO网友:Sally CJ 整理而成
custom_uploader
实际上是wp.media()
而不是HTML元素,因此该变量没有onselect
属性,但它确实有on()
可用于收听select
选择附件后触发的事件。
其次,HTML元素没有innerHTML()
方法,只有一个名称相同的属性,我们可以使用它来更改元素的内部HTML,如下所示:<Element>.innerHTML = \'foo <b>bar bold</b> baz\'
. 请检查MDN web docs 了解更多详细信息。
要解决这些问题,请更改以下内容:
custom_uploader.onselect = function() {
var attachment = custom_uploader.state().get(\'selection\').first().toJSON();
console.log(attachment);
var uploadLogoImage = document.getElementById("upload_image").innerHTML(attachment.url);
}
收件人:
custom_uploader.on( \'select\', function() {
var attachment = custom_uploader.state().get(\'selection\').first().toJSON();
console.log(attachment);
var uploadLogoImage = document.getElementById("upload_image").innerHTML = attachment.url;
} );
此外,如果
#upload_image
实际上是
<input />
或textarea字段,然后使用
value
属性更改输入/文本区域值,或者您可以使用
setAttribute()
.