简单的 ui 日期选择器不起作用

Question

我对这个日期选择器有问题http://jqueryui.com/demos/datepicker/

<script>
    $(function() {
        $( "#datepicker1" ).datepicker({ dateFormat: 'yy-mm-dd' });
    });
</script>
<script>
    $(function() {
        $( "#datepicker2" ).datepicker({ dateFormat: 'yy-mm-dd' });
    });
</script>

<div id="checkinWrapper" class="input-wrapper">
    <input type="text" id="datepicker1" style="width:118px;" class="checkin search-option hasDatepicker" name="checkin" placeholder="Поаѓаме на">
    <span></span>
</div>
<div id="checkoutWrapper" class="input-wrapper">
    <input type="text" id="datepicker2" style="width:118px; margin-left:2px;" class="checkout search-option hasDatepicker" name="checkout" placeholder="Се враќаме">
    <span></span>
</div>

当我在空白页面上测试它时它工作正常，但是当我在我当前的设计中实现它时它不起作用（不显示）。我不知道是什么原因造成的。以下是我包含的脚本：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>

也许问题是因为我在当前设计中实现了其他 jQuery 脚本？有什么解决办法吗？

Answer 1

如果您从两个输入标签中删除 hasDatepicker 类，它将起作用。

datepicker 插件自己添加了这个类，因为这个类已经存在，所以没有创建 datepicker...

请参阅http://jsfiddle.net/UYGXh/ 了解工作（非样式）示例