图像不通过 jquery 显示答案

【问题标题】：images not displaying through jquery图像不通过 jquery 显示
【发布时间】：2019-05-27 09:23:09
【问题描述】：

好的，这里是完整的代码

通过 jquery 修改背景图片 css 属性，图片不显示....检查了路径，它们没问题

div 存在，css 没问题，路径没问题，图像存在，但它适用于 on.show 函数，它不适用于 click 函数

    // when new category show default images
    $('#newCategory').on('show.bs.modal', function () {

        var category = "<?php echo $_SESSION['home-url']; ?>" + 'admin/images/categories/profiles/default.png';
        var banner = "<?php echo $_SESSION['home-url']; ?>" + 'admin/images/categories/banners/default.png';

        $( '#categoryPreview' ).css( { backgroundImage: 'url(' + category + ')' } );
        $( '#bannerPreview' ).css( { backgroundImage: 'url(' + banner + ')' } );
    });       


    // load category info before display dialog
    $('body').on('click', '.btn-upd-id',function(){        

        var id = $(this).attr('upd-id');

        $("#update-category-id").val(id);

        if( id != "" ){ 
            $.post('category/category_info.php', {id: id}, function(data){
                var obj = JSON.parse(data);

                $("#upd-name").val(obj[0].name);

                var category = "<?php echo $_SESSION['home-url']; ?>" + 'admin/images/categories/profiles/' + obj[0].category_image;

                var banner = "<?php echo $_SESSION['home-url']; ?>" + 'admin/images/categories/banners/' + obj[0].banner_image;                    

                $( '#updCategoryPreview' ).css( { backgroundImage: 'url(' + category + ')' } );
                $( '#updBannerPreview' ).css( { backgroundImage: 'url(' + banner + ')' } );       
            })
        }       
    });

HTML

                                <!-- category image -->
                                <div class="row">          
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="category">Category Image</label>
                                            <br/>
                                            <div id="updCategoryPreview"></div>  
                                            <input type="file" class="img" id="upd-category" name="upd-category">
                                        </div>
                                    </div>
                                </div>                                      
                                <!-- banner image -->        
                                <div class="row">                                                
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="banner">Category Banner</label>
                                            <br>
                                            <div id="updBannerPreview"></div>
                                            <input type="file" class="img" id="upd-banner" name="upd-banner">
                                        </div>
                                    </div>
                                </div>

我希望它加载图像，但它什么也不显示。

【问题讨论】：

让您使用开发者工具检查页面。
@lef 请告诉我类别和横幅的结果
@ShahzadKhan 结果是图片的完整路径
使用下面的代码。 $('#updCategoryPreview').css('background-image', 'url(' + category + ')'); $('#updBannerPreview').css('background-image', 'url(' + banner + ')');
可能是您有一些语法问题，无法显示图像。

标签： javascript jquery css

【解决方案1】：

受够了使用了这段代码及其工作

image = new Image();
image.src = url;
image.onload = function () {
    $('#image-holder').empty().append(image);
};

在这里找到 Can I get the image and load via ajax into div

谢谢大家的帮助

【讨论】：