Question

我有一个网页上有几个按钮，我想在选择它时更改它的颜色。有一个example of jQuery, please take a look.我想做同样的事情，但我有点困惑。

我的HTML页面如下：

CSS : .blackButton {   
    background: url("Black_button.jpg");  
    vertical-align: middle; 
    margin-top: 1%;   
    margin-bottom: 1%;  
}


<div id="id1">
    <input type="button" class="blackButton"/>  
</div>

<div id="id2">
    <input type="button" class="blackButton"/>
</div>

<div id="id3">
    <input type="button" class="blackButton"/>
</div>      



js : I just tried, but not working
  $(function() {

         $(".blackButton").selectable();
      });

Answer 1

添加此javascript和.selected的css规则，您应该得到所需的结果。

$(function(){
    $('input.blackButton').live('click', function(e){
        var t = $(e.target);
        if (!t.hasClass('selected'))
            $('input.selected').toggleClass('selected');
        t.toggleClass('selected');
    });
});

创建了jsfiddle。

Answer 2

单击输入时更改background-color CSS样式。你可以通过切换CSS类来实现。例如：

$(function(){
    $('.blackButton').click(function(){
        var elem = $(this);
        elem.toggleClass('selected-item-class-name');
    });
});

Answer 3

即使Zafa在场，我也会添加自己的版本：http://jsfiddle.net/hobobne/me7wf/

如果您告诉我下一步，我可以将其添加到示例中。在表格中提交？通过ajax保存一些设置？等

如何更改<input type =“button”/>的BG颜色

3 个答案: