如何从asp:textbox texmode:date中删除向上向下箭头键?

时间:2015-07-01 09:44:42

标签: javascript asp.net date textbox

如何从asp:textbox texmode:date删除向上向下箭头键?我有textmode日期的文本框,我只想要日历箭头?我该怎么做到这一点?在图片中如何禁用标记区域控件? enter image description here

<asp:TextBox Width="95%" ID="tourEndDate" runat="server" TextMode="Date"  onkeypress="return false" onKeyDown="return false"></asp:TextBox></td>

1 个答案:

答案 0 :(得分:0)

请使用:

  <Style>
    input[type=date]::-webkit-inner-spin-button {
        -webkit-appearance: none;
         display: none;
         }
    </style>

enter image description here

或者你可以使用datepicker。只是

从网上下载AjaxControlToolkit.dll,将其添加到bin文件夹,然后添加引用,然后添加

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %> 

到你的aspx页面。风格部分

<style type="text/css">
.cal_Theme1 .ajax__calendar_container   {
background-color: #DEF1F4;
border:solid 1px #77D5F7;
}

.cal_Theme1 .ajax__calendar_header  {
background-color: #ffffff;
margin-bottom: 4px;
}

.cal_Theme1 .ajax__calendar_title,
.cal_Theme1 .ajax__calendar_next,
.cal_Theme1 .ajax__calendar_prev    {
color: #004080;
padding-top: 3px;
}

.cal_Theme1 .ajax__calendar_body    {
background-color: #ffffff;
border: solid 1px #77D5F7;
}

.cal_Theme1 .ajax__calendar_dayname {
text-align:center;
font-weight:bold;
margin-bottom: 4px;
margin-top: 2px;
color: #004080;
}
</style>

你的TextBox

<asp:TextBox ID="txtDate" runat="server" AutoComplete="off"></asp:TextBox>
<cc1:CalendarExtender ID="ceFromDate" CssClass= " cal_Theme1" TargetControlID="txtDate" Format="dd-MMM-yyyy" runat="server"/>

enter image description here

它会像这样。