jQuery Datepickerがモバイルで動作しません

datepicker要素を含むフォームを作成しています。私は日付で入力があったが、デザイナーはドロップダウンの矢印ではなく、入力フィールドがクリックされたときにカレンダーを開くことを望んでいた。だから、私はデスクトップ上で欲しいと正確に動作するjQueryのdatepickerを使用しています。しかし、モバイルビューに切り替えると、何も読み込まれません。 jQueryの新機能です。ここで jQuery Datepickerがモバイルで動作しません

は頭スクリプトです：

<script type = "text/javascript" src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<script type = "text/javascript" 
    src = "https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script>

スクリプト：

$(function() { 
     $("#datepicker").datepicker(); 
    });

そして、私のhtmlの基本的なバージョン：

<p>Date: <input type = "text" id = "datepicker"></p>

それがロードされない理由について任意のヘルプモバイル上のページは非常に高く評価されています！

出典

2017-08-10 Rachel B.

あなたはjqueryの携帯電話を使用しようとしましたか？ – Dekel

この問題のトラブルシューティングに役立つ情報はありますか？あなたが共有したちょっとしたものを使って、jsFiddleを組み立てて問題を再現しましたが、それは私のモバイルデバイスであっても期待通りに機能します。「モバイルビューに切り替える」と言ったら、モバイルデバイスをエミュレートするブラウザのサイズを変更していますか？ –

@Dekelそれはうまくいきましたが、今はデスクトップサイトのスタイリングが完全に間違っています。私は "data-role：none;"を試みました。それは動作していないようです。 –

$("#datepicker").datepicker();が実行されると、

インスタンス化あなたの日付ピッカーライブラリがロードされているとDOMがロードされたとき：

$(document).ready(function() { 
 
    $("#datepicker").datepicker({ }); 
 
});

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
 
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/smoothness/jquery-ui.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script> 
 
</head> 
 

 
<body> 
 
    <div> 
 
    <input name="date" type="text" placeholder="Choose date" id="datepicker"> 
 
    </div> 
 
</body> 
 

 
</html>

出典

2017-08-12 08:02:57 deblocker

jQuery Datepickerがモバイルで動作しません

答えて

関連する問題