javascript - 如何在 WordPress 图片库中使用 jQuery 选择下拉菜单项？

Question

首先，查看屏幕截图以查看我要选择的内容:

在 WordPress 中，当我单击“新帖子”，然后单击“添加媒体”按钮时，在弹出的图片库中有图像过滤下拉菜单；我想自动选择。弹出窗口加载时的“未附加”项目。

我很难做到这一点。到目前为止，在我的主题的 functions.php 中，我调用了包含 jQuery 代码的 .js 文件。

function my_custom_scripts() {
    wp_enqueue_script( 'my-custom', THEMATER_URL . '/js/custom.js', array('jquery'), '1.0.0', true );
}
add_action('wp_enqueue_scripts', 'my_custom_scripts');

然后在 .js 文件中我有:

jQuery(document).ready(function($) {
    $('#media-attachment-filters').prop('selectedIndex', 6); // select 5th option
});

但是没有任何反应。我错过了什么？

更新:

根据 Christian Nguyen 的代码，我确实让它选择我想要的项目，但是，它实际上并没有根据该选择对图片库进行排序，所以它在功能上只是“突出显示”该项目.我的猜测是它不会触发某些 OnClick/OnSelect 事件。我尝试添加 .trigger('change')，但仍然没有任何乐趣。有谁也知道如何让它真正做到这一点？

到目前为止，我有这段代码，请注意所有被注释掉的项目都会选择该项目，只是没有触发实际的“选择”来进行排序。

/* When Insert Media button gets clicked ... */
$("#insert-media-button").on('click', function() {

     // Set a 'delay' of 0, & then call the function that selects the menu item.
     // NOTE: Skipping the setTimeout, & just directly call the selector doesn't work.
    setTimeout(function() {

        /* BUG: All 4 of the following WILL select the "Unattached" drop-down item,
                        However, ALL pics still get loaded, instead of JUST the UNATTACHED
                        pics, which is what we want.
        */
        //$('#media-attachment-filters').attr('selected', 'selected').trigger('change');
        //$('#media-attachment-filters').val('unattached');
        //$('#media-attachment-filters').prop('selectedIndex', 5);
        //$('#media-attachment-filters>option:eq(5)').prop('selected', true);
    }, 0);
});

另一件需要注意的事情:在我的例子中，.js 也根本没有在管理区域被调用，因为我错误地只为前端排队它，我不得不使用admin_enqueue_scripts 让 .js 加载到实际发生操作的管理区域(后端)。

Answer 1

我有一个临时解决方案:

jQuery(document).ready(function($) {
    $("#insert-media-button").on('click', function() {
        setTimeout(function() {
            $('#media-attachment-filters').val('unattached');
        }, 0);
    });
});