如何在jquery-mobile中顯示Datebox日曆當點擊一個按鈕

我不想有一個日期文本字段，只是我想彈出Datebox（日曆）只有當用戶點擊一個按鈕..如何在jquery-mobile中顯示Datebox日曆當點擊一個按鈕

這個代碼，我發現..

<input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"mode": "calbox"}'>

，但我不希望有一個文本字段。只有按鈕才能顯示日曆

來源

2011-11-16 Bader

看看這裏怎麼辦這樣的： http://stackoverflow.com/questions/8115541/jquery-mobile-datebox-custom-alignment/8125736#8125736 – GerjanOnline

這是否適合您？

http://jsfiddle.net/UtFMs/

$('#linkmodelink').live('click', function() { 
    $('#linkmode').datebox('open'); 
});

HTML

<div data-role="fieldcontain"> 
    <label for="linkmode">Some Date</label> 
    <input name="linkmode" type="date" data-role="datebox" id="linkmode" data-options='{"noButton": true}' /> 
</div> 
<br /> 
<a href="#" id="linkmodelink" data-role="button">Click Here</a>

我只是用了 '上的鏈接打開' 這裏的例子：

http://dev.jtsage.com/jQM-DateBox/demos/odd/open.html

和添加的數據角色=「按鈕」的錨定標記使得JQM添加按鈕標記

來源

2011-11-16 14:00:48

如果您正在尋找完全隱藏輸入，我扔在一起的一對讓選項你：http://jsfiddle.net/UtFMs/1/（請確保你更新了你的源代碼，如果你下載了，這在10分鐘前不工作。）Fwiw，（現在隱藏的）輸入中的值仍然會更新，如果你希望爲其他東西檢索它 –

Adham JTSage是DateBox的開發人員= P –

我是多麼幸運，謝謝@JTSage，請問我有關於datebox的另一個小問題http://stackoverflow.com/questions/8163139/highlight-dates-in-jqm -datebox日曆與 - 兩不同，顏色 – Bader

第一：謝謝！菲爾我們期待這個解決方案！

但是，對於那些JQM v嘗試：1.1.0和JQ五：1.7.1和Datebox五：2.1，你將不得不作出一些輕微的改動代碼（感謝@GeralOE）：

HTML：

<input data-theme="c" name="dtFrom" id="dtFrom" type="date" data-role="datebox" data-options='{"mode": "calbox", "afterToday": true, "hideInput": true }' style="width: 30px" /> 
    <input name="dtTo" id="dtTo" type="date" data-role="datebox" data-options='{"mode": "calbox", "afterToday": true, "hideInput": true }' />      

<div data-role="controlgroup" data-type="horizontal" id="btnCalendar"> 
    <a href="#" id="From" data-role="button">From</a> 
    <a href="#" id="To" data-role="button">To</a> 
</div>

JS：

$('#btnCalendar').on("click", "a", function() { 
    $thisCalendar = $(this).attr("id"); 
    $('#dt' + $thisCalendar).datebox('open'); 
});

你可以測試它：http://jsfiddle.net/geralOE/nAugy/2/（我們會更新它來實現一些其他功能，例如在from和to按鈕上寫入日期）。

另外，考慮到「live」被棄用的1.7，所以你必須使用「delegate」（這反過來將被棄用，所以用「on」做準備。

來源

2012-07-23 22:51:46 nvhdab

如何在jquery-mobile中顯示Datebox日曆當點擊一個按鈕

回答

相關問題