2017-12-28 33 views
0

インターネットなしで仕事をするには、日付ピッカーを使用する必要があります。インターネットなしの日付ピッカー仕事

ソースリンクをhttpsリンクから私のローカルのダウンロードファイルに変更しました。しかし、日付ピッカーは機能しなくなります。 この問題を解決する方法を教えてもらえますか?

理想的なソースのリンク:

<link href = "https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel = "stylesheet"> 
     <script src = "https://code.jquery.com/jquery-1.10.2.js"></script> 
     <script src = "https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 

ローカルにダウンロードしたファイルに変更

<script src = "jquery-ui.js"></script> 
     <script src = "jquery-1.10.2.js"></script> 
     <script src = "jquery-ui.css"></script> 

私はhttpsのリンクが使用されていても、それが正常に動作することを保証することができれば私は良いものでなければなりませんインターネットがないと私の日付ピッカーのために。いくつかのキャッシングを介している可能性があります。 datepickersコードで私の質問を更新

<span style="float: left;margin-left:2em"> <b>Date Range: </b> 
     <input type="text" id="datepicker" > <b>to </b> 
     <input type="text" id="datepicker2"> </span><div id = "Alert" style="float:left;margin-left:2em"> Please select a valid Date Range!</div> 
     ............................................. 

    var startDate; 
     var endDate; 
     var start; 
     var end; 



      $(function() { 
       $("#datepicker").datepicker({ 
        onSelect: function() { 
         startDate = $(this).datepicker('getDate'); 
         start = formatDate(startDate); 
         if(start!=null && end!=null && end>=start) 
         {document.getElementById('Alert').style.visibility = 'hidden'; 
         document.getElementById('canvas-holder').style.visibility = 'visible'; 

         initial(start, end); 

         } 
         else { 
         document.getElementById('Alert').style.visibility = 'visible'; //Will show 
         document.getElementById('canvas-holder').style.visibility = 'hidden'; 
         } 
        } 

       }); 
       $("#datepicker2").datepicker({ 
        onSelect: function() { 
         endDate = $(this).datepicker('getDate'); 
         end = formatDate(endDate); 
         alert('skn here s' + startDate); 
         alert('skn here e' + endDate); 
         if(start!=null && end!=null && end>=start) 
         {document.getElementById('Alert').style.visibility = 'hidden'; 
         document.getElementById('canvas-holder').style.visibility = 'visible'; 
         initial(start, end); 
         } 
         else { 
          document.getElementById('Alert').style.visibility = 'visible'; //Will show 
          document.getElementById('canvas-holder').style.visibility = 'hidden'; 
            } 
         } 

        }); 

       }); 

は、私は、ブラウザのコンソールで取得エラーの下に見つけてください。

Uncaught TypeError: $(...).datepicker is not a function 
    at HTMLDocument.<anonymous> (index.html:64) 
    at fire (jquery-1.10.2.js:3048) 
    at Object.fireWith [as resolveWith] (jquery-1.10.2.js:3160) 
    at Function.ready (jquery-1.10.2.js:433) 
    at HTMLDocument.completed (jquery-1.10.2.js:104) 

私は示唆した変更を加えました。その場合、日付ピッカーは予想通りに表示されますが、表示されません。

日PickerIssue: enter image description here

+0

"動作を停止する"ブラウザのコンソールにエラーがありますか? –

+0

1. srcが正しいディレクトリ(スクリプトが格納されている場所)を指していることを確認していますか? 2.キャッシュにあまり依存しないでください。 – MicD

+0

はい。これらのファイルを親の場所に保存しただけで、他のフォルダは保存していないためです。 –

答えて

1

を期待 enter image description here

日付ピッカーを使用すると、jqueryの-ui.js

前にjqueryのをロードする必要が

<link href = "jquery-ui.css" rel = "stylesheet"> 
<script src = "jquery-1.10.2.js"></script> 
<script src = "jquery-ui.js"></script> 

にこれを変更してみてください

+0

はい、この場合、日付ピッカーが表示されますが、予想通りに表示されません。更新された質問のdatepickerの両方のUIを見つけてください。私は最後にCSSファイルを入れてみました。しかし問題は変わらない。 –

+0

cssファイルをCSSに含めると、コードを編集したばかりです –