Question

我正在创建一个网络应用，我想在其中使用日期选择器

<script src="js/bootstrap-datetimepicker.min.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
<link rel="stylesheet" href="documents/css/reset.css"/>
<link rel="stylesheet" href="css/BeatPicker.min.css"/>
<link rel="stylesheet" href="documents/css/demos.css"/>
<link rel="stylesheet" href="documents/css/prism.css"/>
<script src="js/jquery-1.11.0.min.js"></script>
<script src="js/BeatPicker.min.js"></script>

这些是我从网上下载的脚本和链接

这是我的输入字段，我想使用datepicker

<body>
     <input type="text" data-beatpicker="true"/>
</body>

但是默认按钮带有文本框

我使用css通过制作visibility:hidden;

来删除按钮

    <style>
button, input[type="button"] {
    background-color: #D36161;
    border: medium none;
    color: #FFFFFF;
    cursor: pointer;
    font: bold 14px arial,serif;
    margin: 3px;
    padding: 4px;
    visibility: hidden;
    width: 72px;
}
</style>

但是当我尝试添加另一个按钮时，由于我放置了visibility:hidden

的样式表，它也被禁用了

这是我带id的按钮 <button id="butt">close</button>

我编辑了这样的样式表

<style>
.butt{
visibility:visible;
}
</style>

但仍然没有向我显示所需的按钮

我该怎么办？我想要禁用带有文本框的按钮，但可以看到其他按钮

Answer 1

您正在使用名为“ BeatPicker ”的库。

在使用css搞乱之前，你应该阅读文档。

要删除“清除”按钮，您需要将以下属性添加到日期输入

数据beatpicker模块= “清除”

这将删除清除按钮

此处提供了更多功能：http://act1gmr.github.io/BeatPicker/demos.html

Answer 2

类选择器前面有.，ID选择器前面有#。因此，在您的代码中，将选择器更改为#butt，因为它是您按钮的ID。

Answer 3

尝试这样的事情：

<!DOCTYPE html>
<html>
<head>
<style>
button.visible {
    visibility: visible
}

button.hidden {
    visibility: hidden
}
</style>
</head>
<body>

<button class="visible">This is a visible button</button>
<button class="hidden">This is an invisible button</button>
<button>Notice that the invisible button still takes up space.</button >

</body>
</html>

Answer 4

执行以下操作

将button, input[type="button"]更改为.beatpicker-clearButton，因此您不再遇到此问题，或者Adi Darachi将clear添加到data-beatpicker-module属性以删除按钮

Answer 5

使用此

:w

Answer 6

添加以下css。这将仅隐藏beatpicker清除按钮。

.beatpicker-clearButton {
   display: none;
}

设置按钮

6 个答案: