如何在JavaScript中僅在給定的月份和日期顯示按鈕？

Question

我希望按鈕僅在給定的日期和月份可見，否則要隱藏它。 還希望在首次單擊后禁用該按鈕。 我怎樣才能做到這一點？ 我試過下面的代碼，但沒有幫助我。

Javascript：

<script type="text/javascript">
     function today()
        {
        var currentTime = new Date()
        var month = currentTime.getMonth() + 1
        var day = currentTime.getDate()
        var d = new Date();
        var curr_hour = d.getHours();
        var curr_min = d.getMinutes();


    if(month==1 && day==1)
{ 
document.getElementById('xx').style.visibility='visible';
}
else
{
document.getElementById('xx').style.visibility='hidden';
}
}
</script>

HTML：

<form method=post action="update_registration.jsp" name="form1">
<input type="image" SRC="/Patankar/PNH/images/click_anim.gif"   id="xx"  onClick='today();' ALT="Submit Form" style="visibility:hidden;display:none" >
</form>

Answer 1

請僅選擇一種顯示樣式，例如可見的XOR顯示。 然后

window.onload = function() {

    // you manipulation with date wich set varibale canClick to true if all ok or to false otherwise 

    if (canClick)
    {
       var button = document.getElementById('xx');
      button.style.display = 'block'; //if you choose visibility - button.style.visibility= 'visible';
      button.onclick = function() {this.disabled = false}
    }

}

Answer 2

使用document.getElementById（'xx'）。style.display ='none'; 或document.getElementById（'xx'）。style.display ='block';

Answer 3

我建議對任何Javascripting使用jQuery，因為它可以與所有主要瀏覽器兼容。 然后，您可以執行以下代碼：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">    
    $(document).ready(function () {
        var now = new DateTime();
        var month = 1;
        var day = 1;
        if(now.Month == month && now.Day == day)
        {
            $('#itemToHide').css('display', 'visible');
        }
        else
        {
            $('#itemToHide').css('display', 'hidden');
        }
        $('#itemToHide').click(function () {
            $(this).css('display','hidden');
            $(this).attr('disabled','true');
        }  
    });
</script>

如果將其放入代碼部分，請提供要隱藏id屬性的按鈕，並將上面腳本中的itemToHide更改為您賦予元素的任何ID

編輯：您還需要從按鈕中刪除display：none樣式。

編輯：只是添加了代碼，以便在單擊時將其隱藏。

希望這可以幫助

Answer 4

如果您想在第一次單擊后禁用按鈕，它應該是這樣的（使用jQuery）：

 $('#xx').click(function(){
     $(this).attr('disabled','true');
 }  

Answer 5

    setInterval(function(){
        document.getElementById('abc').style.visibility='hidden';
    }, (new Date(new Date().toDateString())-  new Date(2011, 7, 19) 
/* the date on which button should be hidden*/))

即使從前一天到日期的頁面保持打開狀態，此代碼也將隱藏按鈕。 修改代碼以恢復效果。

Answer 6

無需jQuery

不管這個演示如何，它都能完美運行： http : //jsfiddle.net/enWEM/

在輸入中，您有2個可見性選項（可見和顯示），僅使用一個

接下來，您必須運行同樣缺少的javascript代碼

Answer 7

您的代碼確實是完美的，首先刪除輸入元素中的任何一個id屬性，您編寫了兩個id可能會使腳本感到困惑，

<input type="image" SRC="/Patankar/PNH/images/click_anim.gif"   id="xx"  id="return1" onClick='today();' ALT="Submit Form" style="visibility:hidden;display:none" >

id="xx"  id="return1"

刪除其中的任何一個並在腳本中進行相應的更改，然后進一步使用顯示（而不是可見性）並禁用按鈕的使用，

document.getElementById("xx").disabled=true;

希望這應該工作。

問候，
卡爾提克