在 wordpress 管理面板中删除图像

Question

我想将 <a> 标签添加到 <i>，当我按下图标时，它会删除图像。这是此插件中 WP 图库的代码：

<# if ( data.values[0] ) { #>
    <div class="main_image">
        <div class="main_image_droppable">
            <div class="inner">
                <div class="inner-bordered">
                    <i class="fa fa-file-image-o"></i>
                </div>
                <span>{{ data.l10n.drop }}</span>
            </div>
        </div>
        <img src="{{data.values[0].src}}" />
    </div>
    <div class="stm_mini_thumbs">
        <# _.each( data.values, function( img, id) { #>
            <div class="thumbs">
                <div class="inner">
                    <img src="{{img.thumb}}" />
                    <div class="inner-hover">
                  /* <a> tag should be here */      <i class="fa fa-remove" data-delete="{{id}}"></i>
                        <i class="fa fa-arrows"></i>
                    </div>
                </div>
            </div>
        <# } ) #>
    </div>
<# } else { #>
    <div class="butterbean-placeholder">{{ data.l10n.placeholder }}</div>
<# } #>

我想删除它而不重新加载页面。我完全不知道该怎么做。

Answer 1

您可以通过一些 JS/jQuery 实现这一点，只需将 i 标签包裹在具有特定 class:

的 a 标签中

<a href="#" class="image-remove-btn"><i class="fa fa-remove" data-delete="{{id}}"></i></a>

并使用jQuery监听点击事件移除图片

jQuery(document).ready(function($) {
    $(document).on('click', '.image-remove-btn', function (e) {
        $(this).closest('.thumbs').remove();
    });
});

确保 $(this).closest('.thumbs') 中的 thumbs class 是图像容器的正确 class。

在 wordpress 管理面板中删除图像

remove image in wordpress admin panel

php

wordpress

image

hyperlink