javascript显示本日，本周，本月

在对一些信息查询时通常会用到时间作为搜索条件，今天就做了个时间作为搜索条件的小页面，感觉还挺好看的。下面来看看效果图是如何的哈：

先说明操作步骤，就是点击本日，本周，本月前面的单选按钮就会把自动计算的日期显示到文本框中。

下面就简单的介绍下怎样用的，在页面上放置两个文本框，三个单选按钮和一个按钮，当然为了使自己的界面能够美观呢，用到css样式是必不可少的哈。同样要注意的一个问题是单选按钮的设置，要把这三个单选按钮放置在一个组里。当然也可以用单选按钮组。下面就把界面布局的代码贴上来，我的界面布局挺差的：用到了div和table标签

<div style="90%;  text-align:center; margin-left:20px; margin-top:5px;"><table><tr><td>请输入时间段:</td><td>
        <asp:TextBox ID="txtBeginTime" runat="server" CssClass="inputCss"></asp:TextBox></td><td>......</td><td>
            <asp:TextBox ID="txtEndTime" runat="server" CssClass="inputCss"></asp:TextBox></td><td>
             <asp:radiobutton id="rbtnthisDay" onclick="quickseldate('day');" runat="server" Text="本日" GroupName="quickdate"></asp:radiobutton>
            <asp:radiobutton id="rbtnthisweek" onclick="quickseldate('week');" runat="server" Text="本周" GroupName="quickdate"></asp:radiobutton>
            <asp:radiobutton id="rbtnthismonth" onclick="quickseldate('month');" runat="server" Text="本月" GroupName="quickdate"></asp:radiobutton>
            </td><td ><asp:ImageButton ID="ImageButton1"  ImageUrl="~/images/search.gif"  
                runat="server" onclick="ImageButton1_Click" /></td></tr></table></div>

现在大家看下我的那三个单选按钮是怎样放在一个组里的，设置单选按钮的GroupName等于同一个值就好了，在单选按钮的onclick事件中调用javascript写的函数。下面把代码给大家，

 <script language="javascript" type="text/javascript">
        
            function fillstring(str)
        {
            if(str.length==1)
            {
                str = "0" + str; 
            }
            return(str);
        }
        function quickseldate(type)
        {
            var begintime,endtime;
            var oneminute = 60*1000;
            var onehour   = 60*oneminute;
            var oneday    = 24*onehour;
            var oneweek   = 7*oneday;
            
            var todayDate = new Date();
            var date = todayDate.getDate();
            var month= todayDate.getMonth() +1;
            var year= todayDate.getYear();
            var day = todayDate.getDay();
            if(navigator.appName == "Netscape")
            {
                year = 1900 + year;
            }

            //-->
                        
            if(type=="day")
            {
                begintime = year.toString() + "-" + fillstring(month.toString()) + "-" + 

fillstring(date.toString());
                endtime = begintime;
            }
            else if(type=="week")
            {
                var daytoMon = day-1;
                if(day==0) 
                    daytoMon = 6;
                
                todayDate.setTime(todayDate.getTime()-daytoMon*oneday);
                date = todayDate.getDate();
                month= todayDate.getMonth() +1;
                year= todayDate.getYear();
                day = todayDate.getDay();
                
                begintime = year.toString() + "-" + fillstring(month.toString()) + "-" + 

fillstring(date.toString());
                
                todayDate.setTime(todayDate.getTime()+6*oneday);
                
                date = todayDate.getDate();
                month= todayDate.getMonth() +1;
                year= todayDate.getYear();
                
                endtime = year.toString() + "-" + fillstring(month.toString()) + "-" + 

           fillstring(date.toString());
            }
            else if(type=="month")
            {
                var dateto1 = date-1;
                todayDate.setTime(todayDate.getTime()-dateto1*oneday);
                date = todayDate.getDate();
                month= todayDate.getMonth() +1;
                year= todayDate.getYear();
                day = todayDate.getDay();
                begintime = year.toString() + "-" + fillstring(month.toString()) + "-" + 
                fillstring(date.toString());
                todayDate.setMonth(month);
                todayDate.setTime(todayDate.getTime()-oneday);
                date = todayDate.getDate();
                month= todayDate.getMonth() +1;
                year= todayDate.getYear();
                endtime = year.toString() + "-" + fillstring(month.toString()) + "-" + 
                fillstring(date.toString());

            }
            document.getElementById("<% =txtBeginTime.ClientID %>").value = begintime;
            document.getElementById("<% =txtEndTime.ClientID %>").value = endtime;
        }
        </script>

这段函数的最后两句就是前面定义的文本框的标签，大家好好看下吧。这代码不是我写的，但我知道怎样把它用在合适的位置也是所值的。