时间戳

首页 > 解决方案 > 图像不通过 jquery 显示

javascript - 图像不通过 jquery 显示

问题描述

好的，这是完整的代码

通过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>

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

标签： javascriptjquerycss

解决方案

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

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

在这里找到 我可以通过 ajax 获取图像并加载到 div

谢谢大家的帮助

推荐阅读