今天某人问我一个问题,有关<asp:CheckBox>和<asp:DropDownList>的JS的使用。
情况是这样的,如下图:
Auto Select是一<asp:Label>;然后,接下来的是<asp:CheckBox>和<asp: DropDownList>。现在希望,当勾了Manual select后,可以从下拉列表中选择一个值,用来代替Auto select这个值。
很常见的一个应用。很多人问,对于这样的简单的应用,为什么不直接使用html控件?哎,我也这样想。但是,现实中是没办法 的,现在很多人习惯使用这样的asp控件,由于操作起来的简便性,VS很聪明的。OK,那么使用AutoPostBack属性不一样可以选来选去吗,为什 么要JS?嚯嚯,主要是好看些,页面不用闪啊闪啊的,那样很烦的,不是?
好了,废话少说,这是简单的应用,所以,三下五除二地,手动为<asp:CheckBox>添加一个onclick;为<asp:DropDownList>添加一个onchange。就是这么简单。
代码如下:
页面代码
两段简单的JS如下:
<
script language
=
"
javascript
"
>
function check()
{
var checkbox=document.getElementById('chkManual');
var result=document.getElementById('lblResult');
var dropdown=document.getElementById('ddlManual');
if(checkbox.checked)
{
result.innerText='Manual select 1';
dropdown.disabled=false;
}
else
{
result.innerText='Auto select';
dropdown.selectedIndex=0;
dropdown.disabled=true;
}
}
function dropdown()
{
var result=document.getElementById('lblResult');
var dropdown=document.getElementById('ddlManual');
result.innerText=dropdown.value;
}
</ script >
function check()
{
var checkbox=document.getElementById('chkManual');
var result=document.getElementById('lblResult');
var dropdown=document.getElementById('ddlManual');
if(checkbox.checked)
{
result.innerText='Manual select 1';
dropdown.disabled=false;
}
else
{
result.innerText='Auto select';
dropdown.selectedIndex=0;
dropdown.disabled=true;
}
}
function dropdown()
{
var result=document.getElementById('lblResult');
var dropdown=document.getElementById('ddlManual');
result.innerText=dropdown.value;
}
</ script >