2016-02-25 44 views
0

我有一個datecoder和時間選擇器在我的代碼,你可以看到下面,但只有datepicker的作品。當我用時間選擇器點擊字段時,它不顯示下拉框?jQuery任何時間選擇器不工作

<script type="text/javascript" src="~/assets/js/plugins/pickers/datepicker.js"></script> 
    <script type="text/javascript" src="~/assets/js/plugins/pickers/anytime.min.js"></script> 

    <script type="text/javascript"> 
    $(document).ready(function() { 
     $(".text").hide(); 
     $("#r1").click(function() { 
      $(".text").show(); 
     }); 
     $("#r2").click(function() { 
      $(".text").hide(); 
     }); 
     $(function() { 
      $(".datepicker").datepicker({ 
       format: 'dd/mm/yyyy' 
      }); 
      $(function() { 
       $(".timepicker").anytime({ 

       }) 

      }); 
     }); 
    }); 
</script> 

在此先感謝

+0

工作的例子是有瀏覽器的控制檯窗口中的錯誤?在哪裏jquery加載可以請你顯示完整的代碼 –

+0

我得到一個錯誤的控制檯說'任何時間'不是一個函數 – Lxwis

+0

嘗試使用: AnyTime.picker(); 代替: $(函數(){$ ( 「timepicker」)隨時({ }) }); – ReDEyeS

回答

0

我已經將代碼隨時選擇器

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> 
 
<script src="http://www.ama3.com/anytime/anytime.5.1.2.min.js"></script> 
 

 
<script> 
 
    AnyTime.picker("field1", 
 
    { format: "%W, %M %D in the Year %z %E", firstDOW: 1 }); 
 
    $("#field2").AnyTime_picker(
 
    { format: "%H:%i", labelTitle: "Hora", 
 
     labelHour: "Hora", labelMinute: "Minuto" }); 
 
    </script>
<style> 
 
/* anytime.5.1.2.min.css 
 
Copyright 2008-2015 Andrew M. Andrews III. 
 
License: creativecommons.org/licenses/by-nc-sa/3.0/ 
 
Any+Time is a trademark of Andrew M. Andrews III */ 
 

 
.AnyTime-pkr *{border:0;font:inherit;font-size:x-small;font-style:normal;font-weight:400;list-style-type:none;margin:0;padding:0;white-space:nowrap;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.AnyTime-win{background-color:#F0F0F1;border:3px solid silver;display:inline-block;font:normal normal normal xx-small/normal sans-serif;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px}.AnyTime-pkr,.AnyTime-pkr *{text-align:center}.AnyTime-pkr .AnyTime-cloak{background-color:#D7D7D7;opacity:.7;position:absolute;filter:alpha(opacity=70)}.AnyTime-pkr .AnyTime-hdr{background-color:#D0D0D1;color:#606062;font-family:Arial,Helvetica,sans-serif;font-size:medium;font-weight:400;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}.AnyTime-pkr .AnyTime-x-btn{background-color:#FCFCFF;border:1px solid #F99;color:#FF9F9F;cursor:default;float:right;margin:.25em .25em 0 0;width:1.5em;-moz-border-radius:.4em;-webkit-border-radius:.4em;border-radius:.4em}.AnyTime-pkr .AnyTime-btn{background-color:#FCFCFE;border:1px solid #999;color:#606062;cursor:default;font-family:Arial,Helvetica,sans-serif;margin:0 .1em .1em 0;padding:.2em .3em;-moz-border-radius:.1em;-webkit-border-radius:.1em;border-radius:.1em}.AnyTime-pkr .AnyTime-body{margin:0 1em 1em 0}.AnyTime-pkr .AnyTime-date{display:inline-block;margin-left:1em;vertical-align:top}.AnyTime-pkr .AnyTime-lbl{color:#606063;font-family:Arial,Helvetica,sans-serif;font-size:100%;font-weight:400;font-style:normal;margin-top:.8em}.AnyTime-pkr .AnyTime-yrs{width:20em}.AnyTime-pkr .AnyTime-yrs-past-btn,.AnyTime-pkr .AnyTime-yrs-ahead-btn{display:inline-block;width:2.4em}.AnyTime-pkr .AnyTime-yr-prior-btn,.AnyTime-pkr .AnyTime-yr-cur-btn,.AnyTime-pkr .AnyTime-yr-next-btn{display:inline-block;width:4.8em}.AnyTime-pkr .AnyTime-mons{width:20em}.AnyTime-pkr .AnyTime-mons:after{content:"";display:table;clear:both}.AnyTime-pkr .AnyTime-mon-btn{float:left;width:3.2em}.AnyTime-pkr .AnyTime-mon7-btn{clear:left}.AnyTime-pkr .AnyTime-dom-table{background-color:#F0F0F1;border:1px solid #E3E3E4;border-spacing:1px;width:20em}.AnyTime-pkr th.AnyTime-dow{background-color:#C0C0C1;color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:95%;font-weight:400;font-style:normal;padding:.1em .3em}.AnyTime-pkr .AnyTime-dom-btn{text-align:right;padding-right:.5em}.AnyTime-pkr .AnyTime-dom-btn-empty,.AnyTime-pkr .AnyTime-min-ten-btn-empty,.AnyTime-pkr .AnyTime-min-one-btn-empty,.AnyTime-pkr .AnyTime-sec-ten-btn-empty,.AnyTime-pkr .AnyTime-sec-one-btn-empty{background-color:#F3F3F4;border:1px solid #C0C0c1}.AnyTime-pkr .AnyTime-time,.AnyTime-pkr .AnyTime-hrs-am,.AnyTime-pkr .AnyTime-hrs-pm,.AnyTime-pkr .AnyTime-mins-tens,.AnyTime-pkr .AnyTime-mins-ones,.AnyTime-pkr .AnyTime-secs-tens,.AnyTime-pkr .AnyTime-secs-ones{display:inline-block}.AnyTime-pkr .AnyTime-hrs,.AnyTime-pkr .AnyTime-mins,.AnyTime-pkr .AnyTime-secs,.AnyTime-pkr .AnyTime-offs{display:inline-block;margin-left:1em}.AnyTime-pkr .AnyTime-hr-btn{text-align:right;width:3.5em}.AnyTime-pkr .AnyTime-min-ten-btn,.AnyTime-pkr .AnyTime-min-one-btn{width:2em}.AnyTime-pkr .AnyTime-sec-ten-btn,.AnyTime-pkr .AnyTime-sec-one-btn{width:2em}.AnyTime-pkr .AnyTime-off-cur-btn{display:inline-block;overflow:hidden}.AnyTime-pkr .AnyTime-off-select-btn{display:inline-block;vertical-align:top;width:2em}.AnyTime-pkr .AnyTime-yr-selector{position:absolute}.AnyTime-pkr .AnyTime-body-yr-selector{margin:.8em 1em}.AnyTime-pkr .AnyTime-yr-mil,.AnyTime-pkr .AnyTime-yr-cent,.AnyTime-pkr .AnyTime-yr-dec,.AnyTime-pkr .AnyTime-yr-yr,.AnyTime-pkr .AnyTime-yr-era{display:inline-block;vertical-align:top}.AnyTime-pkr .AnyTime-mil-btn,.AnyTime-pkr .AnyTime-cent-btn,.AnyTime-pkr .AnyTime-dec-btn,.AnyTime-pkr .AnyTime-yr-btn{width:2em}.AnyTime-pkr .AnyTime-era-btn{margin-left:1em}.AnyTime-pkr .AnyTime-off-selector{margin:1em 2em;position:absolute}.AnyTime-pkr .AnyTime-body-off-selector{margin:.8em 1em;overflow-x:hidden;overflow-y:auto;white-space:nowrap}.AnyTime-pkr .AnyTime-off-off-btn{text-align:left}.AnyTime-pkr .AnyTime-cur-btn{border:1px solid #333334;background-color:#C0C0C1;color:#FCFCFE;font-weight:700}.AnyTime-pkr .AnyTime-out-btn{background-color:#F0F0F1;border:1px solid #C0C0c1}.AnyTime-pkr .AnyTime-focus-btn{border:1px dashed #000} 
 
</style> 
 
<style> 
 
    #field2 { background-image:url("clock.png"); 
 
    background-position:right center; background-repeat:no-repeat; 
 
    border:1px solid #FFC030;color:#3090C0;font-weight:bold} 
 
    #AnyTime--field2 {background-color:#EFEFEF;border:1px solid #CCC} 
 
    #AnyTime--field2 * {font-weight:bold} 
 
    #AnyTime--field2 .AnyTime-btn {background-color:#F9F9FC; 
 
    border:1px solid #CCC;color:#3090C0} 
 
    #AnyTime--field2 .AnyTime-cur-btn {background-color:#FCF9F6; 
 
     border:1px solid #FFC030;color:#FFC030} 
 
    #AnyTime--field2 .AnyTime-focus-btn {border-style:dotted} 
 
    #AnyTime--field2 .AnyTime-lbl {color:black} 
 
    #AnyTime--field2 .AnyTime-hdr {background-color:#FFC030;color:white} 
 
    </style>
English: <input type="text" id="field1" size="50" 
 
      value="Sunday, July 30th in the Year 1967 CE" /><br/> 
 
Español: <input type="text" id="field2" value="12:34" />

+0

@Lxwis你能檢查答案 –