Question

我想知道如何将图像添加到jquery按钮。直到现在我在我的项目中使用了jquery ui按钮，我从图形团队获得了自定义图像，所以我想实现它们。

submit.button({ icons: {primary:'ui-icon-trash'}, text: false })

如何将自定义图像添加到此jquery按钮？

Answer 1

我只想给按钮分配一个类......

$("#buttonId").button({

    icons: {primary: null},
    text: false

}).addClass("ButtonClass");

然后你的CSS类看起来像这样......

.ButtonClass
{
    background-image: url(../images/Button.png);   
    background-repeat: no-repeat; 
    border: none;    
}

Answer 2

<button>Trash</button>
<style>
    .ui-button .ui-button-icon-primary {
        background: url('/my-custom-trash-image.png');
    }
</style>
<script>
    $(function() {
        $('button').button({
            icons: {
                primary: 'ui-icon-trash'
            },
            text: false
        });
    });
</script>

不幸的是，您必须传递primary图标的有效值，即使它不会被使用。

直播示例 - http://jsfiddle.net/aMVrz/

将图像添加到jquery按钮

2 个答案: