如何獲得jQuery UI的日期選擇器來關閉外點擊

我環顧四周，並嘗試了一些東西已經從我發現並沒有什麼似乎工作。如何獲得jQuery UI的日期選擇器來關閉外點擊

我的HTML：

<input type="text" value="" name="custom_st" id="start_date" class="tb fl hasDatepicker">

我嘗試了下面......

$("#start_date").blur(function(e) { $(this).datepicker("hide"); });

...，我想它的工作，直到我發現，這顯然適用於text field - 所以，是，當你點擊日期選擇器外的將關閉，但是如果你點擊任何東西否則就會在日期選擇器上它會也 close-su ch作爲小箭頭按鈕前進/後退一個月。

然後我嘗試這個..

$(document).click(function(e){ 
    if (!$(e.target).parents().filter('.ui-dialog').length) { 
     $('#start_date').datepicker("hide"); 
    } 
});

..但後來意識到這是你點擊它，它打開，然後再次關閉，因爲你觸發點擊功能顯然不會工作，如儘快關閉它。

讀另一SO質疑有人提到與此相關的，我也使用jQuery selectbox plugin使用時，可能有問題。

我試過，但它沒有工作，要麼... ui-datepicker-div是日期選擇器的包含元素的ID。

$('#ui-datepicker-div').blur(function() { 
    //$('#ui-datepicker-div').hide(); 
    $('#start_date').datepicker("hide"); 
});

是否有其他方法可以關閉它？

來源

2014-01-22 Brett

您可能很懶，只需在body標籤中添加點擊處理程序，然後在點擊處於日期選擇器內時阻止它。 e.target應該讓你弄清楚。 – Rooster

的jQuery UI的日期選擇控件[已經默認這種行爲（http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/eggplant/jquery-ui.css）... – Pointy

@指出這不是它在我的網站上的表現，這就是爲什麼我提到了選擇框插件，所以我需要一種關閉它的替代方法。 – Brett

$(document).click(function(e) { 
    var ele = $(e.toElement); 
    if (!ele.hasClass("hasDatepicker") && !ele.hasClass("ui-datepicker") && !ele.hasClass("ui-icon") && !$(ele).parent().parents(".ui-datepicker").length) 
    $(".hasDatepicker").datepicker("hide"); 
});

來源

2017-03-10 10:44:07

如何獲得jQuery UI的日期選擇器來關閉外點擊

回答

相關問題