javascript - 如何使 Bootstrap 日期选择器中的容器附加到特定元素？

Question

您将如何在 Bootstrap 日期选择器中添加指定容器选项以使日期选择器能够附加到特定元素？

我添加了容器选项，但它不起作用，即添加时日期选择器没有打开。当我删除容器选项时，它默认为正文并且日期选择器显示正常。

我真的想让日期选择器仅附加到特定元素并固定在滚动上，但它根本不起作用，即日期选择器随滚动一起移动。真令人沮丧。

这是日期选择器代码，

$('#StartDate').bootstrapDP({ 
format: 'mm/dd/yyyy',
startDate: defaultDate,
container: '#StartDate",
todayBtn: 'linked',
clearBtn: true,
beforeShowDay: function(Date){

    var curr_day = Date.getDate();
    var curr_month = Date.getMonth()+1;
    var curr_year = Date.getFullYear();        
    var curr_date=curr_month+','+curr_day+','+curr_year;    

    if(!(typeof nat_arr == "undefined")){

        if (nat_arr.indexOf(curr_date)>-1) return false;
    }

},
daysOfWeekDisabled: [0,6],
todayHighlight: true
}).on('changeDate',dateChanged);

我尝试了所有的方法。我调试了 Jquery UI JS，发现问题与添加容器时未附加显示 block 之类的问题有关，但我不确定。

请帮帮我，那太好了!

Answer 1

解决方案非常简单。您所要做的就是在日期选择器选择器周围添加一个 div 并为其指定一个 id。因此，以下方法起到了作用:

container: div#startDate,

这意味着对于带有 id“startDate”的日期选择器文本字段周围的 div，将其附加到元素。此外，您可能必须将 CSS 属性“overflow:visible”设置为容器元素，以允许通过“溢出”容器来显示日期选择器。