時，這是如何我想防止iPhone的默認鍵盤聚焦在<input>
<script type="text/javascript">
$(document).ready(function(){
$('#dateIn,#dateOut').click(function(e){
e.preventDefault();
});
});
</script>
但輸入劇照「推出」 iPhone的鍵盤
PS：我想這樣做，因爲我使用日期選擇器插件日期
通過設置輸入字段readonly="true"你應該阻止任何人在輸入任何東西，但仍然能夠在它推出一個click事件。
這也有用在非移動設備爲您使用的日期/時間選擇器
既然不能在上面發表評論評論，我被迫提交「的答案。」
與所選答案的問題是，設置現場爲只讀採取現場了iPhone上的Tab順序。所以，如果你想通過點擊「下一步」進入的形式，你會直接跳到了現場。
它是有道理的，只讀不會讓用戶改變值（只有JavaScript），所以我想是自然的，它跳過它 –
但是，我測試過的桌面瀏覽器 - 包括Safari/mac - tabbing會帶你到只讀字段。 –
@JohnVance即使設置了tab-index屬性，這是否正確？或者會覆蓋效果？ （我問，因爲我沒有iPhone，但會很感激這方面的知識） –
我在這裏問過類似的問題，得到了一個夢幻般的答案 - 用iPhone本機日期選擇器 - 這是偉大的。
How to turn off iPhone keypad for a specified input field on web page
簡介/僞代碼：
if small screen mobile device
set field type to "date" - e.g. document.getElementById('my_field').type = "date";
// input fields of type "date" invoke the iPhone datepicker.
else
init datepicker - e.g. $("#my_field").datepicker();
原因動態地設置字段類型爲「日期」是歌劇，否則將彈出自己的本機日期選擇器，和我假設你想在桌面瀏覽器上一致地顯示datepicker。
問題是可用或不可避免的日期已設置與datepicer ...遲到謝謝！ –
因此，這裏是我的解決方案（類似於約翰·萬斯的回答）：
首先去這裏，並得到一個函數來檢測移動瀏覽器。
http://detectmobilebrowsers.com/
他們有很多不同的方式來檢測，如果你是移動的，所以找到一個與你使用的是什麼工作。
你的HTML頁面（僞代碼）：
If Mobile Then
<input id="selling-date" type="date" placeholder="YYYY-MM-DD" max="2999-12-31" min="2010-01-01" value="2015-01-01" />
else
<input id="selling-date" type="text" class="date-picker" readonly="readonly" placeholder="YYYY-MM-DD" max="2999-12-31" min="2010-01-01" value="2015-01-01" />
JQuery的：
$(".date-picker").each(function() {
var min = $(this).attr("min");
var max = $(this).attr("max");
$(this).datepicker({
dateFormat: "yy-mm-dd",
minDate: min,
maxDate: max
});
});
這樣你仍然可以使用本機的日期選擇在移動，同時還設置了最小和最大日期無論哪種方式。
非移動領域應爲只讀，因爲如果像iOS版Chrome移動瀏覽器的「請求桌面版」，那麼他們可以圍繞移動檢查得到，你還是要防止鍵盤顯示出來。
但是，如果該字段是隻讀的，它可能會看到一個用戶，他們不能改變字段。您可以通過更改CSS來使其看起來像不是隻讀（即將邊框顏色更改爲黑色），但除非您更改所有輸入標籤的CSS，否則將難以保持外觀一致瀏覽器。
爲了讓我只是將日曆圖像按鈕添加到日期選擇器。只需更改您的JQuery代碼：
$(".date-picker").each(function() {
var min = $(this).attr("min");
var max = $(this).attr("max");
$(this).datepicker({
dateFormat: "yy-mm-dd",
minDate: min,
maxDate: max,
showOn: "both",
buttonImage: "images/calendar.gif",
buttonImageOnly: true,
buttonText: "Select date"
});
});
注意：您必須找到合適的圖像。
下面的代碼工作對我來說：解決這個按我的意見是使用「ignoreReadonly」
<input id="myDatePicker" class="readonlyjm"/>
$('#myDatePicker').datepicker({
/* options */
});
$('.readonlyjm').on('focus',function(){
$(this).trigger('blur');
});
的最佳方式。
首先使輸入字段爲只讀，然後添加ignoreReadonly：true。 這將確保即使文本字段是隻讀的，彈出窗口也會顯示。
$('#txtStartDate').datetimepicker({
locale: "da",
format: "DD/MM/YYYY",
ignoreReadonly: true
});
$('#txtEndDate').datetimepicker({
locale: "da",
useCurrent: false,
format: "DD/MM/YYYY",
ignoreReadonly: true
});
});
@ rene-pot是正確的。然而，您將在該網站的桌面版本上有一個不允許的標誌。解決這個問題的方法是將readonly =「true」應用於僅顯示在移動視圖上而不顯示在桌面上的div。看看我們在這裏做了什麼http://www.naivashahotels.com/naivasha-hotels/lake-naivasha-country-club/
是的，它的工作原理。 http://jsbin.com/onelor/ – katspaugh
哼！謝謝！但會是日期選擇器能夠設置選擇的值？ –
是的。 Readonly僅供用戶使用，不適用於JavaScript。 –