jquery datepicker删除当前突出显示的课程

时间:2017-07-25 06:27:16

标签: javascript jquery css date datepicker

我想从我的jquery datepicker实例中完全删除当前的高亮类。我使用datepicker内联作为div,所以我发现在类上使用.find和.remove的所有规定方法都不起作用。我已经尝试删除.ui-state-highlight的所有CSS条目,没有任何改进。 jsfiddle我的基本代码,我建议在新标签中打开它,以便更容易回到这个问题。以下是代码检查的屏幕截图screenshot,显示了我需要删除的类。

代码:

<head><script>
$( function() {
var selections = ["2017-07-29"]
function bansingle(date) {
        var excerpt = jQuery.datepicker.formatDate('yy-mm-dd', date);
        return [ selections.indexOf(excerpt) == -1 ]
    }
// somehow combine this function later.
//function bandow(date) {
//              var day = date.getDay();
//          return [(day != 0 && day != 6)];
//      }


$('#dp1').datepicker({
    beforeShowDay: bansingle,
    altField:'#alternate1',
        altFormat: 'm-d-yy',
        fielddateFormat: 'm-d-yy',
    minDate: "+0d",
    //maxDate: "+1m", // set latest selectable date
});
$('#dp1').datepicker("setDate", null); //clears alternate1 input field value
});</script>
</head>
<body>
<div id="dp1"></div>
</body>

编辑突出显示看起来就像其他可用日期一样不好,因为当点击当前日期时,你不能告诉它已经存在。这就是为什么我需要找出如何在我使用datepicker的div上完全删除高亮类。

我的问题与this other question不同,因为:虽然与其他帖子存在一些共性,但我试图实现不同的最终结果,并且该帖子的建议是将CSS设置为模仿其他单元格正如我在上面的段落中所述,这不适合我需要的东西。

编辑:

使用that other question作为参考,我能够重新排列和更改其他一些CSS样式,以便现在所有可用日期看起来都相同,但最终结果不完整。这使我依赖于使altfield可见,以向用户显示所选择的点击。如果有办法在文件头中使用此样式:

.ui-state-active {background: #F00;}

改为:

.ui-state-active {background: #F00 !important;}

首次点击任何可用日期的datepicker内联日历GUI时,颜色响应将匹配用户的操作以及将传递给PHP的数据。

3 个答案:

答案 0 :(得分:0)

您可以使用以下属性:

    <ul class="nav nav-tabs">
            <li  ng-repeat="l in list" > 

                <a href="#firsttab" ng-click="tab = 1"  data-toggle="tab" >
            {{l.title}} </a>

                <div class="tab-content" >
                     <div id="firsttab" ng-click="tab = 1" ng-
                                                show="tab===1">
                    Id: {{l.id}} <br> 
                     Name: {{l.Name}} <br>
                     Content: {{l.content}} <br>
                     TemplateFile: <div ng-include="l.templateUrl"></div>
                </div>

 </ul>
        </div>
    </li>

答案 1 :(得分:0)

最好的方法是编辑CSS源代码。例如:

public MyPage()
{
    InitializeComponent();

    Loaded += (s, e) => ViewModel = new MyPageViewModel();
}

...现在您可以添加样式,就像其他单元格一样!

答案 2 :(得分:0)

您可以按以下方式覆盖css。

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default
{
    border: 1px solid #c5dbec;
    background: #dfeffc url(images/ui-bg_glass_85_dfeffc_1x400.png) 50% 50% repeat-x;
    color: #2e6e9e;
}