服务器控件调用JS
一、两类JS的触发设计
1.提交之前的JS -- 加js的事件
例:
<script language="javascript">
// 构造函数
function test()
{
alert("abcdefg");
return true;
}
</script>
// 添加点击事件,点击按钮后调用test 返回值,如果获得Faluse 则不执行C#代码 ;true 执行代码;
<asp:Button ID="Button1" runat="server" OnClientClick="return test();" Text="Button" OnClick="Button1_Click" />
C#代码:
2.提交之后 的JS -- 用C#代码向页面上写<script>..</script>
在aspx 页面添加 Literal 控件
在cs 页面:
Label1.Text = DateTime.Now.ToString();
// literal 控件用于页面输出。其内容是可以编程的
Literal1.Text = "<script language=javascript>alert('" + DateTime.Now.ToString() + "正确吗?')</script>";
可以实现点击按钮前后弹出提示信息;
二、除了Button之外的其它控件如何触发JS?(其他控件没有Onclick 事件)
要点思想:
1.直接在服务端控件的HTML代码中加上JS的事件。
2.在C#代码界面中的PageLoad中,使用“控件名.Attributes.Add("键","值");”
例子:效果:点击前提示(“请输入姓名”) 输入后不提示 。输入值直接传给Label文本框;
★★★★★★★★★★★★控件:TEXTBOX★★★★★★★★★★★★★★
HTML 知识点:
// document - HTML 文档 getElementById("to") - 其中的 id="to" 的 HTML 元素
// innerHTML - HTML 元素的内部文本
document.getElementById("to").innerHTML=
代码:
1 添加TEXTBox 控件后,在aspx 中添加Onblur(失去焦点后触发) 事件,
<asp:TextBox ID="TextBox1" onfocus="this.value='';" onblur="document.getElementById('Label1').innerHTML=this.value;" runat="server" Height="47px">必填</asp:TextBox>
★★★★★★失去焦点触发事件★★★★★★ onblur="document.getElementById('Label1').innerHTML=this.value;"
★★★★★★★★★★★Label★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
效果:添加点击事件,点击后弹出”你好“提示
代码:<asp:Label ID="Label2" runat="server" onclick="alert('你好!');" Text="Label"></asp:Label>
★★★★★★★★★★★ RadioButten★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
效果: 点击“同意” “下一步” 点击”不同意“ “下一步不可用”
知识点补充:
setAttribute() 方法用于改变属性的值
removeAttribute() 方法删除指定属性。
<asp:RadioButton ID="RadioButton1" runat="server" onclick="document.getElementById('Button2').removeAttribute('disabled')" GroupName="q" OnCheckedChanged="RadioButton1_CheckedChanged" Text="同意" />
<asp:RadioButton ID="RadioButton2" runat="server" onclick="document.getElementById('Button2').setAttribute('disabled','disabled')" Checked="True" GroupName="q" Text="不同意" />