jquery ui datepicker - altfield作爲div而不是輸入

我使用jQuery UI中的altfield和altformat選項向用戶顯示友好的日期，同時在隱藏字段中爲數據庫格式化日期。唯一的一點是，我不希望在輸入框中顯示給用戶的日期（視覺上表明他們可以輸入），我只是希望它顯示爲文本。我知道我可以設計一個輸入框的樣式，所以它看起來不像是一個，但我寧願只使用div並更新文本。但是，它似乎只能用於輸入字段，如果將其設置爲div ID，則它什麼也不做。jquery ui datepicker - altfield作爲div而不是輸入

有沒有人克服過這個問題？

來源

2009-09-07 ianmcn

我想建議，你只是禁用字段，但在jquery ui datepicker網站，停止腳本工作。也許你可以使用禁用的字段，並仍然捕捉點擊事件，打開datepicker並更新其值？破解其代碼並添加使用禁用輸入的功能：P – 2009-09-07 13:57:37

感謝您的評論。我可以讓它與禁用的輸入字段一起工作，但是從可用性的角度來看 - 我不希望它成爲輸入字段，因爲我不希望它給出用戶可以輸入內容的信號它，即使他們不能！ – ianmcn 2009-09-07 14:51:58

老兄，如果你是正確的，那麼一般的計算機用戶甚至不會理解它的輸入字段。我使用我的gf進行傻瓜式測試，即使她有一些體面的計算機技能。所有這些測試都告訴我，如果看起來不像通常那樣，那麼它可能不是它。這意味着如果你的輸入看起來不像輸入，並且在編輯它時不能改變它的內容，那麼它可能不是輸入。用戶只是接受他無法在那裏做任何事情的事實。已禁用輸入與內容區域相同的bg，替換邊界或刪除邊界。你去了。 – 2009-09-07 17:49:33

我已經得到了它在使用ONSELECT這一個div顯示：

onSelect: function(dateText, inst) { 
//formatDate Requires a new date object to work 
     var myDate = new Date(dateText); 

//Set a new var with different format to use 
     var newFormat = $.datepicker.formatDate("DD, d MM, yy", myDate); 
//Choose the div you want to replace 
     $("#yourselctorhere").html(newFormat); 
    } 
    });

來源

2009-09-14 20:30:47 matthewb

答案是使類型的輸入=隱藏，然後選擇相應的值，並將其分配到的文字你div

$("myPicker").datepicker({ 
altField: "#altInput",

。

var hiddenDate = $("[name='altInput']").attr('value'); 
$("#myDate").text(hiddenDate);} 
});

。

<input id = "altInput" type = "hidden"/> 
<div id = "myDate"></div>

來源

2011-03-18 04:17:00

使用CSS：P

.div,.div:focus{ 
    display:block; 
    background:#fff; 
    border:0px; 
    color:#333 
} 
<input type="text" class="div" readonly id="altInput" />

來源

2013-12-18 10:03:47 h0mayun

我發現最好的辦法是在jquery.ui.datepicker-cc.js

第一搜索改變這種文件_updateAlternative功能並更改此行：

$(altField).each(function() { $(this).val(dateStr); });

例如，我已經改變了這個：

$(altField).each(function() { $(this).val(dateStr); $(this).text(dateStr); });

現在你可以把你想要的任何元素的替代文本。我希望這會有所幫助。

來源

2017-10-05 14:14:32 MajiD

jquery ui datepicker - altfield作爲div而不是輸入

回答

相關問題