jQuery datepicker无法在第二次单击时工作

时间:2013-12-16 00:11:13

标签: javascript jquery jquery-ui cross-browser datepicker

任何人都可以帮助我在http://dev.ther8server.com的某个部分找到日期选择器背后的问题

当我从日期点击并选择日期并再次点击datepicker时,不会弹出。我需要点击to或者身体某处,然后再次点击from以使其正常运行。我真的很难找到这个问题背后的原因。任何人都可以帮我提出任何建议。感谢。

此问题仅适用于Chrome和Safari。它在Firefox中运行良好。

HTML code:

<li class="date-field" id="from">
                    <a href="#" onclick="return false;" class="calendar">opener</a>
                    <input type="text" value="Check in" name="date_in" value="" /> 
                    <div class="datepicker-holder"></div> 
                  </li>
                  <li class="date-field" id="to">
                    <a href="#" onclick="return false;" class="calendar">opener</a>
                      <input type="text" value="Check out" name="date_out"  />
                      <div class="datepicker-holder"></div>
                  </li>

进口&amp; JS:

  <script type="text/javascript" src="/assets/js/jquery-1.8.3.min.js"></script>


  <script src="/assets/js/frontend/jquery-ui-1.10.2.custom.js"></script>

  <script type="text/javascript" src="/assets/js/jquery.main.js"></script>
  <script type="text/javascript" src="/assets/js/main.js"></script>
  <script type="text/javascript" src="/assets/js/loadmask/jquery.loadmask.js"></script>
  <!--[if lt IE 9]><link rel="stylesheet" type="text/css" href="/assets/css/ie.css" /><![endif]-->

  <script type="text/javascript">
  var jslocale = "en-AU";
  var ajaxload = "";

  var search_params = {"global_keywords":"","referer_page":"","keywords":"","room":false,"date_in":"","date_out":"","hotel_id":"","destination_id":"","date_in_stamp":"","date_out_stamp":"","view_type":"","trip_rating":"","star_rating":"","min_rate":"","max_rate":"","amenities":"","sort":"","all_results":"","roomCode":"","rateCode":"","bedCode":"","allStarsSelection":"","region_id":"","lang":null,"country":null,"curr":null}; 


  </script>

1 个答案:

答案 0 :(得分:1)

首先,我不明白为什么你使用那么多代码来管理两个简单的日期选择器而不是仅使用jQueryUI's default

其次,我可以看到您在用户点击输入后打开日期选择器,但绑定链接到<​​strong>焦点事件而不是单击事件。

当您选择隐藏日期选择器的日期时,以编程方式触发焦点事件以将光标返回到输入。问题是,焦点事件只触发一次。仅通过单击已读取的聚焦元素,它不会再次触发。直到您通过点击外部来触发模糊事件。

your script的快速而肮脏的建议。变化:

input.bind('focus',function(){
                showDatepicker();
            })

input.bind('click',function(){
            showDatepicker();
        })