我有一个任务来创建帖子类型的媒体库图像, 例如”
woocommerce产品库图像”
, 而无需任何插件, 这都是通过meta框自定义的。我创建了元框”
Gallery Images”
, 也有JS, 但是当我单击”
添加图像”
按钮时, 它没有打开图库以选择图像, 而是在控制台中返回错误
未捕获的TypeError:无法读取未定义的属性” 状态”【WP Media Gallery Metabox无法读取未定义的属性” 状态” 】我从这里源代码中找到了这段代码
以下是一些屏幕截图:
文章图片
文章图片
在第二张照片中, 我做了控制台:
console.log(wp); console.log(wp.media); console.log(wp.media.gallery); console.log(wp.media.gallery.edit(‘ [Gallery ids =” ‘ + val +'” ]’ )+” -框架” );现在, 这是我的代码:
/*
* Add a meta box
*/
function post_gallery_images_metabox() {
add_meta_box(
'post_gallery_images', 'Gallery Images', 'post_gallery_images_metabox_callback', 'inject_template', 'side', 'default'
);
}
add_action( 'add_meta_boxes', 'post_gallery_images_metabox' );
/*
* Meta Box Callback function
*/
function post_gallery_images_metabox_callback( $post ) {wp_nonce_field( 'save_feat_gallery', 'inject_feat_gallery_nonce' );
$meta_key = 'template_gallery_images';
echo inject_image_uploader_field( $meta_key, get_post_meta($post->
ID, $meta_key, true) );
}function inject_image_uploader_field( $name, $valuehttp://www.srcmini.com/= '' ) {$image = 'Upload Image';
$button = 'button';
$image_size = 'full';
$display = 'none';
?>
<
p>
<
?php
_e( '<
i>
Choose Images<
/i>
', 'mytheme' );
?>
<
/p>
<
label>
<
div class="gallery-screenshot clearfix">
<
?php
{
$ids = explode(', ', $value);
foreach ($ids as $attachment_id) {
$img = wp_get_attachment_image_src($attachment_id, 'thumbnail');
echo '<
div class="screen-thumb">
<
img src="' . esc_url($img[0]) . '" />
<
/div>
';
}
}
?>
<
/div>
<
input id="edit-gallery" class="button upload_gallery_button" type="button"
value="http://www.srcmini.com/<
?php esc_html_e('Add/Edit Gallery', 'mytheme') ?>
"/>
<
input id="clear-gallery" class="button upload_gallery_button" type="button"
value="http://www.srcmini.com/<
?php esc_html_e('Clear', 'mytheme') ?>
"/>
<
input type="hidden" name="<
?php echo esc_attr($name);
?>
" id="<
?php echo esc_attr($name);
?>
" class="gallery_values" value="http://www.srcmini.com/<
?php echo esc_attr($value);
?>">
<
/label>
<
?php
}/*
* Save Meta Box data
*/
function template_img_gallery_save( $post_id ) {
if ( !isset( $_POST['inject_feat_gallery_nonce'] ) ) {
return $post_id;
}if ( !wp_verify_nonce( $_POST['inject_feat_gallery_nonce'], 'save_feat_gallery') ) {
return $post_id;
} if ( isset( $_POST[ 'template_gallery_images' ] ) ) {
update_post_meta( $post_id, 'template_gallery_images', esc_attr($_POST['template_gallery_images']) );
} else {
update_post_meta( $post_id, 'template_gallery_images', '' );
}
}
add_action('save_post', 'template_img_gallery_save');
JS:
jQuery(document).ready(function(jQuery) {
jQuery('.upload_gallery_button').click(function(event){
var current_gallery = jQuery( this ).closest( 'label' );
console.log(current_gallery);
if ( event.currentTarget.id === 'clear-gallery' ) {
//remove value from input
current_gallery.find( '.gallery_values' ).val( '' ).trigger( 'change' );
//remove preview images
current_gallery.find( '.gallery-screenshot' ).html( '' );
return;
}// Make sure the media gallery API exists
if ( typeof wp === 'undefined' || !wp.media || !wp.media.gallery ) {
return;
}
event.preventDefault();
// Activate the media editor
var val = current_gallery.find( '.gallery_values' ).val();
var final;
if ( !val ) {
final = '[ gallery ids="0" ]';
} else {
final = '[ gallery ids="' + val + '" ]';
}
var frame = wp.media.gallery.edit( final );
console.log(wp);
console.log(wp.media);
console.log(wp.media.gallery);
console.log(frame + " -- frame");
frame.state( 'gallery-edit' ).on('update', function( selection ) {
console.log('coming');
//clear screenshot div so we can append new selected images
current_gallery.find( '.gallery-screenshot' ).html( '' );
var element, preview_html = '', preview_img;
var ids = selection.models.map(
function( e ) {
element = e.toJSON();
preview_img = typeof element.sizes.thumbnail !== 'undefined' ? element.sizes.thumbnail.url : element.url;
preview_html = "<
div class='screen-thumb'>
<
img src='" + preview_img + "'/>
<
/div>
";
current_gallery.find( '.gallery-screenshot' ).append( preview_html );
return e.id;
}
);
current_gallery.find( '.gallery_values' ).val( ids.join( ', ' ) ).trigger( 'change' );
}
);
return false;
});
});
我不知道该怎么办, 为什么会发生此错误。请帮我。
#1 将替换为, 将替换为
推荐阅读
- REST API中的WP分页
- wp_nav_menu插入ul,无法设置类或避免找到
- #私藏项目实操分享# go gin使用自定义中间件
- Linux进程和计划任务管理
- #yyds干货盘点# 性能问题分析策略
- Java 新的日期时间 API#yyds干货盘点#
- #yyds干货盘点# 1. 这才是 Python 学习的正确起手姿势,滚雪球学 Python
- #私藏项目实操分享#教你用OpenCV 和 Python实现圆物检测《-》HoughCircles
- 第四章-Java继承#yyds干货盘点#