モバイルデバイスとPCのJavascript/jQueryの相違

Question

Webページの一部の入力にdatetime pickerを使用しています。問題は、モバイルデバイスを使用して入力を選択すると、日時ピッカーとモバイルデバイスのキーボードの両方が表示されることです。入力で 'readonly'属性を使うと、この問題は解決されますが、入力を編集できなくなります。私が望むのは、入力を携帯端末で読み取り専用にし、PC上で編集可能にすることです。私はモバイルデバイスとPCを区別するための最良の方法を探しています。

これは私がこれまで持っているものです。

if (/Mobi|Tablet|iPad|iPhone/.test(navigator.userAgent)) { 
    $('.dtpicker').each(function(){ 
     $(this).prop('readonly', true); 
    }); 
} 

歓迎される示すからデフォルトのモバイルキーボードを防止する任意の他の方法。

Answer 1

Afaikモバイルキーボードはフォーカスイベントを使用してキーボードを表示し、ぼかしを使用して非表示にします。フォーカス後にreadonly属性を削除すると、キーボードがポップアップしないはずです。

Clickイベントは、私が代わりに焦点を当てることを選択したようにフォーカスした後に解雇される傾向にある。

if (/Mobi|Tablet|iPad|iPhone/.test(navigator.userAgent)) { 
    $('.dtpicker').each(function() { 
    $(this).attr('readonly', true) 
     .on("click", function() { 
     $(this).removeAttr('readonly'); 
     }) 
     .on("blur", function() { 
     $(this).attr('readonly', true); 
     }) 

    }) 
}