我正在使用此 javascript 代码来使用 hijri 日期选择器，但是当我打开 datepicker 并单击 div 或正文时，我的 datepiker 没有关闭。当我点击外侧时，任何人都可以帮助关闭日期选择器吗？我需要更正此代码并在单击日历或正文外部时隐藏日历。
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
<title>Health Athority</title>
<link rel="stylesheet" href="https://ZulNs.github.io/libs/calendar.css"/>
<script type="text/javascript" src="https://ZulNs.github.io/libs/hijri-date.js"></script>
<script type="text/javascript" src="js_clander.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<style>
.my_row{
margin-top: 30px;
padding: 20px;
}
#testme{
width:400px;
border: 3px solid blue;
}
</style>
</head>
<div id="testme">
<div id="datepicker"><input id="picked-text" type="text" size="35"/><input id="pick-button" type="button" onclick="pickADate();" value="pick"/></div>
</div>
<script type="text/javascript">
var pickedTxt = document.getElementById('picked-text'),
pickBtn = document.getElementById('pick-button'),
datepicker = new Calendar();
document.getElementById('datepicker').appendChild(datepicker.getElement());
datepicker.getElement().style.marginTop = '10px';
datepicker.callback = function() {
pickedTxt.value = datepicker.getDate().getDateString();
pickedTxt.selectionStart = 0;
pickedTxt.selectionEnd = pickedTxt.value.length;
pickedTxt.focus();
};
datepicker.onHide = function() {
pickBtn.style.display = 'inline-block';
};
function pickADate() {
pickBtn.style.display = 'none';
datepicker.show();
}
</body>
</html>最佳答案
您的示例似乎不起作用，您想要的只是在单击正文时关闭选择器，您可以通过 Jquery focusout 函数来实现它。
$('#datepicker').on('focusout', function(){
$('YourDatePickerID').hide();
});
关于javascript - 单击外部时日期选择器不会关闭，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45430620/