0

假设我有下一个表格：

<form action="/orders/add" class="form-horizontal" id="OrderAddForm" method="post">
   <div style="display:none;"><input type="hidden" name="_method" value="POST"></div>         

   <div class="control-group">
      <button type="button" class="btn" id="new-order-line">New order line</button>
   </div>

   <div class="control-group">
      <input class="btn my-hidden" type="submit" value="Save Orderr">       
   </div>
</form>

我的CSS：

.my-hidden {
   display: none;
}

还有我的js：

$(function() {
   $('#new-order-line').click(function() {
     $('.my-hidden').show('slow');
   });
});

因此，每当我单击“新订单行”按钮时，我都想显示“保存订单”按钮，但似乎 Twitter Bootstrap 覆盖了我的“我的隐藏”类，因为它位于“表单”元素和我的“保存订单”中' 按钮始终显示。我读到有些人有同样的问题

一些解决方法来隐藏我的按钮？

4

1 回答 1

1

我不认为这本身就是一个问题。使用 Twitter Bootstrap CSS 规则可能无法（轻松）完成，但如果问题是 Twitter Bootstrap 覆盖了您想要做的事情，您始终可以创建自己的具有更高特异性的规则。

一种简单的方法是添加到属性中，style="display: none;"因为内联样式会自动享受顶级特异性。

为您的课程提供更高特异性的一种方法是稍微详细说明选择器。例如，这比您的示例具有更高的特异性，但我不知道这是否足够：

.form-horizontal .control-group .my-hidden { display: none; }

（我希望我正确理解了你的问题......如果不是，请责备我；）

于 2013-01-17T20:06:29.353 回答