Question

我已经制作了一个php页面（关于酒店预订的内容），我想制作一个JQuery Datepicker，我在空白页面上尝试了这个，提供了所需的css和js文件，并且它可以工作。

但是当我在自定义页面上尝试它时，它无法正常工作。我认为这与我页面中的其他css和/或其他javascript文件有关，但我删除它们进行测试。但遗憾的是它并没有出现......似乎是什么问题？

代码：

<!DOCTYPE HTML>
    <html>
        <head>
            <link rel="stylesheet" href="assets/css/reservationsCSS.css" />
            <link href = "css/jquery-ui.css" rel = "stylesheet">
            <?php include 'includes/head.inc.php'; ?>

    <!-- Datepicker JavaScript function -->
    <script type="text/javascript">
     $(function() {
        $( "#checkInDate" ).datepicker({dateFormat:"mm/dd/yy", minDate: 0}).datepicker("setDate",new Date());
        $( "#checkOutDate" ).datepicker({dateFormat:"mm/dd/yy", minDate: 0}).datepicker("setDate",+1);
     });
  </script>
</head>

<body id="top">
    <!-----navbar-section------>
    <header class = "container">
        <?php include 'includes/navbar.inc.php'; ?>
    </header>
    <!-----navbar-section------>

            <section id="banner">
                <div class="inner">
                    <header>
                        <h1>Reservation</h1>
                        <h2>Please enter your arrival and departure date.</h2>
                        <p></p>
                    </header>
                </div>
            </section>

        <!-- Main -->
            <div id="main">
                <div class="inner">
                    <form action = "datepickerProcess.php" method = "POST">
                        <p>Check-in Date: <input type = "text" id = "checkInDate" name = "checkInDate"></p> <br>
                        <p>Check-out Date: <input type = "text" id = "checkOutDate" name = "checkOutDate"></p> <br>
                        <input type = "submit" value = "Go to Rooms >">
                    </form>
                </div>
            </div>

        <!-- Footer -->
            <footer id="footer">
                <?php include 'includes/footer.inc.php';?>
            </footer>

    <!-- Scripts -->
        <!-- <script src="assets/js/jquery.min.js"></script>
        <script src="assets/js/jquery.scrolly.min.js"></script>
        <script src="assets/js/jquery.poptrox.min.js"></script>
        <script src="assets/js/skel.min.js"></script>
        <script src="assets/js/util.js"></script>
        <script src="assets/js/main.js"></script> -->
        <script type="text/javascript" src = "js/jquery-1.10.2.js"></script>
        <script type="text/javascript" src = "js/jquery-ui.js"></script>

</body>
</html>

Answer 1

尝试添加

<!-- Datepicker JavaScript function -->
    <script type="text/javascript">
     $(function() {
        $( "#checkInDate" ).datepicker({dateFormat:"mm/dd/yy", minDate: 0}).datepicker("setDate",new Date());
        $( "#checkOutDate" ).datepicker({dateFormat:"mm/dd/yy", minDate: 0}).datepicker("setDate",+1);
     });
  </script>

在jquery导入你的页面之后它应该工作正常

<script type="text/javascript" src = "js/jquery-1.10.2.js"></script>
<script type="text/javascript" src = "js/jquery-ui.js"></script>

我的JQuery Datepicker没有出现

1 个答案: