无法更改Bootbox中确认框的按钮颜色

时间:2016-01-04 04:41:20

标签: javascript twitter-bootstrap bootbox

在Bootbox中,我无法更改confiem框的按钮颜色,请帮帮我

这是我的代码:

bootbox.confirm('This action removes all partners from this project and resets all existing stock distribution. <br /> <br /> Do you wish to continue?','Cancel','Remove', function (result) {
    if (result == true) {
        //do something
    }
});

2 个答案:

答案 0 :(得分:1)

bootbox允许您向按钮添加类。有关工作示例,请参阅以下代码段。在CSS文件中放置您想要的任何样式,或者更好地坚持使用标准引导颜色以保持一致性。在示例中,我使用btn-danger和btn-default bootstrap类以及pull-right和pull-left,但是你可以使用你想要的任何类

如果您仍然遇到问题,可能是bootbox与bootstrap和jquery版本不匹配?

&#13;
&#13;
bootbox.confirm({
  message: 'This action removes all partners from this project and resets all existing stock distribution. <br /> <br /> Do you wish to continue?',
  buttons: {
    'cancel': {
      label: 'Cancel',
      className: 'btn-default pull-left'
    },
    'confirm': {
      label: 'Remove',
      className: 'btn-danger pull-right'
    }
  },
  callback: function(result) {
    if (result) {
      // whatever you want to do here
      console.log(result)
    }
  }
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src="https://github.com/makeusabrew/bootbox/releases/download/v4.4.0/bootbox.min.js"></script>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

你可以使用CSS

<style>
     .bootbox-confirm div div div button.btn-primary{
         background-color: orange
     }
 </style>