JQuery UI DatePicker запускается из текстовой ссылки
Я пытаюсь настроить мое меню css так, чтобы одна из текстовых ссылок запускала каландар средства выбора даты. Я сократил все до кода ниже. Проблема, с которой я сталкиваюсь, заключается в том, что приведенный ниже код не работает, но когда я удаляю теги ul, li, он начинает работать.
Я использую 1.8.0 JQuery и 1.8.23 JQuery UI.
<!DOCTYPE html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#dp").datepicker({
onSelect: function(dateText, inst) {
alert(dateText);
},
});
$("#datep").click(function() {
$("#dp").datepicker("show");
});
});
</script>
</head>
<body>
<ul>
<li><a href="#" id="datep">Test</a><input type="hidden" id="dp" /></li>
</ul>
</body>
</html>
Некоторые странные вещи, которые я заметил. Если я переместлю ввод под ul, он будет работать вроде как, но получит ошибку после нескольких нажатий и выключений, но если я добавлю пустой div под этим вводом, то он начнет работать нормально, кажется.
Любая помощь очень ценится.