隱藏使用jQuery

我使用struts2的jQuery插件小號日期選擇一個datepicker如下隱藏使用jQuery

<sj:datepicker id="frdate" name="training.fromDate" 
      label="From Date (dd-mm-yyyy)" maxDate="0" />

我想隱藏這對某些coditions.I寫了這樣一個jQuery。

$("#frdate").hide(); //this will hide textbox of datepicker 
$("label[for='frdate']").hide(); // this will hide label of datepicker

但是datepicker按鈕仍然顯示？如何使用jquery隱藏它？

The generated html code is: 
<tr> 
<td class="tdLabel"> 
    <label for="frdate" class="label">From Date (dd-mm-yyyy):</label></td> 
<td><input type="text" name="training.fromDate" value="" id="frdate"/></td> 
</tr> 

<script type='text/javascript'> 
jQuery(document).ready(function() { 
jQuery.struts2_jquery_ui.initDatepicker(false); 
}); 
jQuery(document).ready(function() { 
var options_frdate = {}; 
options_frdate.showOn = "both"; 
options_frdate.buttonImage = "/ONLINE/struts/js/calendar.gif"; 
options_frdate.maxDate = "0"; 
options_frdate.jqueryaction = "datepicker"; 
options_frdate.id = "frdate"; 
options_frdate.name = "training.fromDate"; 
    jQuery.struts2_jquery_ui.bind(jQuery('#frdate'),options_frdate); 
}); 
</script>

來源

2012-11-16 sowmya r a

可能是你應該在渲染時將其隱藏，使用''標籤？ – Quincy

要隱藏你需要

從輸入文本字段
隱藏輸入文本字段銷燬日期選擇器功能的日期選擇器

要顯示你需要一個datepicker

顯示輸入文本字段
添加到它的日期選擇器功能

以下是演示：http://jsfiddle.net/ezKwN/

function hideIt(){ 
    $("#frdate").datepicker("destroy"); 
    $("#frdate").hide(); 
} 

function showIt(){ 
    $("#frdate").show(); 
    $("#frdate").datepicker(); 
}

我不知道這是否適用於Struts2的jQuery的日期選擇器太多，但我希望是這樣。

但是考慮到使用該標籤，您將該funcionality硬編碼到頁面，它不應該是動態的，那麼（如果上述解決方案不起作用），如果您需要顯示/隱藏它根據用戶交互，你應該考慮使用原生jQuery日期選擇器而不是Struts2（僅用於動態日期選取器）

編輯：作爲另一個選項（具有比使用原生jQuery重新編碼所有日期選擇器的影響小），您可以簡單地將標籤封裝在<div>中，並隱藏/顯示div。

來源

2012-11-16 10:54:13

我已經按照你的建議做了改動，但它不工作。在原來的jQuery datepicker是最後一個選項之前，我正在尋找其他解決方案，如果有的話。 –

發佈您的日期選擇器生成的html代碼請 –

- 將生成的html代碼 –

function hideIt(){ 
    $("#frdate").hide(); 
    $("label[for='frdate']").hide(); 
    $("#frdate").datepicker("destroy"); 
} 

function showIt(){ 
    $("#frdate").show(); 
    $("label[for='frdate']").show(); 
    $("#frdate").datepicker({ 
    showOn : "both", 
    buttonImage : "/path/struts/js/calendar.gif", 
    maxDate : "0", 
    jqueryaction : "datepicker", 
    id : "frdate", 
    name : "training.fromDate" 
    }); 
}

來源

2012-12-20 10:57:03

可以隱藏有兩種方法之一jQuery的日期選擇器：

刪除它完全：$('input[type=text]#yourInput').datepicker("destroy");
隱藏它：$('input[type=text]#yourInput').datepicker("hide");
- 隱藏它可能是更好的，所以你不要不需要用你想要的所有參數重新初始化它。

您也可以隱藏輸入，如果你想： - $('input[type=text]#yourInput').hide();

來源

2013-12-10 17:43:45

隱藏使用jQuery

回答

相關問題