2

我想制作一个在单击日历图像时显示的日历，并且无论何时选择日期，它都会显示在文本框中。我已经完成了这部分，但问题是每当我更改日历的月份时，页面会自行刷新并且日历显示再次变为无，而再次单击日历图像时，日历会显示下个月。我想更改日历的月份而不刷新页面。

我在 Visual Studio 中制作它。我在网站上搜索查询，但几乎所有答案都使用 PHP（我不明白）。

代码：

<asp:TextBox ID="txtCal" runat="server"></asp:TextBox> <img alt="" src="CalendarImage.jpg" width="20px" height="20px" onclick="show()" /> </br>
<div id="cal">
<asp:Calendar ID="Calendar1" runat="server" onselectionchanged="Calendar1_SelectionChanged"></asp:Calendar>
</div>

OnChangingSelectedDate

protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {
        txtCal.Text = Calendar1.SelectedDate.ToString("dd/MM/yyyy");
    }

样式表：

#cal
        {
            display: none; 
        }

JavaScript 函数：

function show() {
    document.getElementById("cal").style.display = "block";
}
4

1 回答 1

1

使用这个 java 脚本 

<script type="text/javascript">  
   function popupCalendar()
    {
      var dateField = document.getElementById('dateField'); // toggle the div 
      if (dateField.style.display == 'none') 
        dateField.style.display = 'block'; 
      else dateField.style.display = 'none';          

     } 
 </script>

和一个文本框：

      <asp:TextBox id="txtDate" Runat="server" /> <img src="cal.png"    onclick="popupCalendar()" />

和 div 标签中的日历：

    <div id="dateField" style="display:none;">  
<asp:Calendar id="calDate" OnSelectionChanged="calDate_SelectionChanged"  
        Runat="server" SelectionMode="Day" 
        onvisiblemonthchanged="calDate_VisibleMonthChanged" /> </div>

在后面的代码中：

     protected void calDate_SelectionChanged(object sender, EventArgs e)
{
    txtDate.Text = calDate.SelectedDate.ToString("d");
}
 protected void calDate_VisibleMonthChanged(object sender, MonthChangedEventArgs e)
{
  ClientScript.RegisterStartupScript(this.GetType(), "myScript", "<script language=JavaScript>popupCalendar();</script>");
}
于 2013-06-24T13:30:25.333 回答