シマウマのdatepicker selectイベントが発生していません

なぜコードはlocalhostで動作しませんか？ユーザーがカレンダーを開いて日付を選択すると、アラート・メッセージがポップアップされているはずですが、それは起こっていません。それはjsfiddle.netに取り組んでいます。シマウマのdatepicker selectイベントが発生していません

<!doctype html> 
<html> 
    <head> 
     <title>Zebra_DatePicker examples</title> 
     <link rel="stylesheet" href="http://dl.dropboxusercontent.com/u/14855/zebra/css/default.css" type="text/css"> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-3.0.0.min.js"></script> 
     <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/Zebra_datepicker/1.9.4/javascript/zebra_datepicker.js"></script> 
    </head> 
    <body> 
     <input type="text" class="datepicker" id="date1" value="Select First Date"/> 
     <input type="text" class="datepicker" id="date2" value="Select Last Date"/> 
     <script> 
      $(document).ready(function() { 
      $(".datepicker").Zebra_DatePicker({ format: "d-m-y" }); 
     }); 
      $("#date1").Zebra_DatePicker({ 
       onSelect: function() { 
       $(this).change(); 
       alert($(this).context.value); 
       } 
      }); 
     </script> 
    </body> 
</html>

出典

2016-06-16 Kerem

JavaScriptコンソールにはどのような種類のエラーがありますか？そして、ローカルで実行しているときには、 'file：///'または 'http：// localhost /'を意味するのでしょうか？ –

私は誤りを犯しません。私はhttp：// localhostを意味します – Kerem

あなたは「うまくいかない」とはどういう意味ですか？日付ピッカーが表示されないことを意味しますか？（それは私が仮定しているものです） –

わかりました。問題が発生している可能性があることがわかりました。

私が正しく理解すると、.Zebra_DatePicker()の2番目の呼び出しが上書きされています。最初の選択$('.datepicker')はの後により具体的には$('#date1')です。特殊な日付ピッカーは、ページの読み込み中に初期化されます。 $.ready()が発生した場合、他の日付ピッカーでがに上書きされ、onSelectが消去されます。

あなたはこのように、両方の$.readyハンドラに置くことによって、それを修正することができます：

<!doctype html> 
 
<html> 
 
    <head> 
 
     <title>Zebra_DatePicker examples</title> 
 
     <link rel="stylesheet" href="http://dl.dropboxusercontent.com/u/14855/zebra/css/default.css" type="text/css"> 
 
     <script type="text/javascript" src="http://code.jquery.com/jquery-3.0.0.min.js"></script> 
 
     <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/Zebra_datepicker/1.9.4/javascript/zebra_datepicker.js"></script> 
 
    </head> 
 
    <body> 
 
     <input type="text" class="datepicker" id="date1" value="Select First Date"/> 
 
     <input type="text" class="datepicker" id="date2" value="Select Last Date"/> 
 
     <script> 
 
     $(document).ready(function() { 
 
      $(".datepicker").Zebra_DatePicker({ format: "d-m-y" }); 
 
      $("#date1").Zebra_DatePicker({ 
 
       onSelect: function() { 
 
       $(this).change(); 
 
       alert($(this).val()); 
 
       } 
 
      }); 
 
     }); 
 
     </script> 
 
    </body> 
 
</html>

これは私のローカルホスト上で働いていました。

注：$(this).context.value ~~は動作していないようです。~~ はdeprecated in jQuery 3.0です（あなたが使用している）。代わりに$(this).val()を使用してください。

出典

2016-06-17 00:30:41

ありがとうございました。あなたは本当に私を救った。 – Kerem

シマウマのdatepicker selectイベントが発生していません

答えて

関連する問題