个性化阅读
专注于IT技术分析

WP Media Gallery Metabox无法读取未定义的属性”状态”

我有一个任务来创建帖子类型的媒体库图像, 例如” woocommerce产品库图像”, 而无需任何插件, 这都是通过meta框自定义的。我创建了元框” Gallery Images”, 也有JS, 但是当我单击”添加图像”按钮时, 它没有打开图库以选择图像, 而是在控制台中返回错误

未捕获的TypeError:无法读取未定义的属性”状态”

我从这里源代码中找到了这段代码

以下是一些屏幕截图:

在此处输入图片说明
在此处输入图片说明

在第二张照片中, 我做了控制台:

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, $value = '' ) {

    $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="<?php esc_html_e('Add/Edit Gallery', 'mytheme') ?>"/>
        <input id="clear-gallery" class="button upload_gallery_button" type="button"
               value="<?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="<?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


将替换为, 将替换为

赞(0) 打赏
未经允许不得转载:srcmini » WP Media Gallery Metabox无法读取未定义的属性”状态”
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者

微信扫一扫打赏