Javascript/jQuery移動設備和PC之間的差異

Question

我在網頁上的一些輸入上使用了日期時間選擇器。問題是，當使用移動設備並選擇輸入時，日期時間選擇器和移動設備鍵盤都會出現。通過在輸入中使用'只讀'屬性將解決此問題，但會使輸入不可編輯。我想要的只是將輸入保持在移動設備上並且可以在PC上進行編輯。我正在尋找移動設備和PC之間差異化的最佳方式。

這是我到目前爲止有：

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

防止默認的移動鍵盤從顯示的歡迎任何其他方法。

Answer 1

Afaik移動鍵盤使用焦點事件顯示鍵盤，模糊以隱藏它。如果在焦點後刪除只讀屬性，則不應該彈出鍵盤。

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); 
     }) 

    }) 
}