在C#开发过程中,免不了写一些JS,其实做后端开发的,本身不擅长写JS,干脆总结一下,方便自己也方便别人,分享给大家。呵呵~~
1.按钮前后台事件
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button"
OnClientClick="alert('客房端验证,阻止向服务器端提交');return false;" />
</div>
2.注册相关事件:onblur,onclick,onchange
this.TextBox1.Attributes.Add("onchange",
"alert('数据被改动,现检查输入是否符合规则');");
</div>
3.注册相关属性:
this.TextBox1.Attributes.Add("readOnly", "true");
</div>
4.引入JS文件
前台HTML页面:
<script type="text/javascript" src="JScript.js" language="javascript"></script>
<script type="text/javascript" language="javascript">
function fn_Name()
{
alert("JS");
}
</script>
</div>
后台cs页面:
this.RegisterClientScriptBlock("jsFile",
"<script type='text/javascript' src='JScript.js' language='javascript'></script>");
[code]
5.点击按钮时 相关栏位 非空判断
[code]
function checkEmpty(txtObj,msgShow)
{
if(txtObj.value == "")
{
alert(msgShow);
return false;
}
}
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button"
OnClientClick="return checkEmpty(TextBox1,'TextBox1 不能为空')" />
</div>
6.通过ChcekBox的是否点选来控制其相对应的TextBox 是否可输入
function chkTextBox(chkObj,txtObj)
{
if(chkObj.checked==true)
{
txtObj.value = "";
txtObj.readOnly = false;
txtObj.focus();
}
if(chkObj.checked == false)
{
txtObj.value = "";
txtObj.readOnly = true;
}
}
<input id="Checkbox1" type="checkbox" onclick="chkTextBox(Checkbox1,TextBox1)" />
</div>
7.传值到模态窗口 并得到传回的值
var EnCodeQueryName = escape(Name);
var strPara = "'dialogWidth: 400px;dialogHeight: 400px;dialogLeft: 300px;dialogTop: 200px;toolbar: no;menubar: no;resizable: yes;location: no;status: no;scrollbars= no'";
var ReturnInfo = window.showModalDialog("QryName.aspx?&Name="+EnCodeQueryName +"&QueryID="+QueryType+"",'',strPara);
if(ReturnInfo !=null)
{
var arrayReturnInfo = ReturnInfo .split("@");
document.all.drpID.value = arrayReturnInfo[1];
document.all.txtName.value= arrayReturnInfo[2];
}
</div>
8.弹出JS的确认对话框,并根据确认结果 触发后台相关操作
if(confirm('确认如何吗?'))
{
document.all.hidbtn_Submit.click();
}
else
{
document.all.hidbtn_Cancel.click();
}
</div>
HTML页面相关代码:
<input id="hidbtn_Submit" type="button" value="确认修改"
style="display:none;"
onserverclick="hidbtn_Submit_ServerClick"
runat="server" />
</div>
9.添加页面对快捷键的响应,如 按F2时 进行新增按钮的操作等
#region 添加页面对快捷键的响应
string strJS_ShortKey = "<script language='javascript' type='text/javascript' > ";
strJS_ShortKey += " document.onkeydown=shortKeyDown; ";
strJS_ShortKey += " function shortKeyDown() ";
strJS_ShortKey += " { ";
// 新增
if (this.ButtonCtl1.ImgBtn_AddFamily.Visible)
{
string btnInsertCID = this.ButtonCtl1.ImgBtn_Insert.ClientID.Trim();
//F2 - 113
strJS_ShortKey += " if(event.keyCode=='113') ";
strJS_ShortKey += " { ";
strJS_ShortKey += " document.all('" + btnInsertCID + "').click();";
strJS_ShortKey += " event.keyCode= 0; ";
strJS_ShortKey += " event.returnValue = false; ";
strJS_ShortKey += " return false; ";
strJS_ShortKey += " } ";
}
// 修改
if (this.ButtonCtl1.ImgBtn_Edit.Visible)
{
string btnEditCID = this.ButtonCtl1.ImgBtn_Edit.ClientID.Trim();
//F3 - 114
strJS_ShortKey += " if(event.keyCode=='114') ";
strJS_ShortKey += " { ";
strJS_ShortKey += " document.all('" + btnEditCID + "').click();";
strJS_ShortKey += " event.keyCode= 0; ";
strJS_ShortKey += " event.returnValue = false; ";
strJS_ShortKey += " return false; ";
strJS