总结ASP.NET C#中经常用到的13个JS脚本代码

在C#开发过程中,免不了写一些JS,其实做后端开发的,本身不擅长写JS,干脆总结一下,方便自己也方便别人,分享给大家。呵呵~~

1.按钮前后台事件

代码如下:

<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button"
OnClientClick="alert('客房端验证,阻止向服务器端提交');return false;" />

2.注册相关事件:onblur,onclick,onchange

代码如下:

this.TextBox1.Attributes.Add("onchange",
"alert('数据被改动,现检查输入是否符合规则');");

3.注册相关属性:

代码如下:

this.TextBox1.Attributes.Add("readOnly", "true");

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>

后台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 不能为空')" />

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)" />

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];
}

8.弹出JS的确认对话框,并根据确认结果 触发后台相关操作

代码如下:

if(confirm('确认如何吗?'))
{
  document.all.hidbtn_Submit.click();
}
else
{
  document.all.hidbtn_Cancel.click();
}

HTML页面相关代码:

代码如下:

<input id="hidbtn_Submit" type="button" value="确认修改"
style="display:none;"
onserverclick="hidbtn_Submit_ServerClick"
runat="server" />

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_ShortKey += "  } ";
}
strJS_ShortKey += " } ";
//注册事件
Page.RegisterStartupScript("shortKey", strJS_ShortKey);
#endregion

10.弹出的提示 分行显示

代码如下:

alert('aaa \r\n bbb \r\n ccc');

如果是在后台.cs文件中注册
则需要

代码如下:

string strAlertContent = "aaa"+" \\r\\n ";
strAlertContent += "bbb" +" \\r\\n ";

11.点击GridView上的某一行时,行首列处的RadioButton处于选中状态,同时保存相关值在隐藏栏位

代码如下:

//用查询得的数据集进行绑定
if (dt.Rows.Count > 0)
{
    //绑定
    this.gv_InfoFromSendModule.DataSource = dt;
    this.gv_InfoFromSendModule.DataBind();
    //确定按钮显示
    this.btn_OK.Visible = true;
    this.txthid_RowCount.Text = dt.Rows.Count.ToString();
}
//GridView的RowDataBound
protected void gv_InfoFromSendModule_RowDataBound(object sender, GridViewRowEventArgs e)
{
   if (e.Row.RowIndex < 0)
      return;
   e.Row.Attributes.Add("onclick", "radButton('" + e.Row.RowIndex.ToString() + "','" + e.Row.Cells[1].Text.Trim() + "');");
   //RadioButton rad = (RadioButton)e.Row.Cells[0].FindControl("rad_Select");
   //rad.Attributes.Add("onclick", "radButton('"+e.Row.RowIndex.ToString()+"','"+ e.Row.Cells[1].Text.Trim()+"');");
}
//行上所绑定的JS
function radButton(rowIndex,rowGUID)
{
    //gv_InfoFromSendModule$ctl02$rad_Select
    var rowCount = parseInt(document.all.txthid_RowCount.value)+2;
    for(var i=2;i<rowCount;i++)
    {
        var tmpName;
        if(i<10)
        {
            tmpName = "gv_InfoFromSendModule$ctl0"+i+"$rad_Select";              
        }
        else
        {
            tmpName = "gv_InfoFromSendModule$ctl"+i+"$rad_Select";  
        }
        //取得对应的Radio对象
        var tmpRadio = document.getElementById(tmpName);
        //当前选中 其他取消选中
        if((i-2) == rowIndex)
        {                
            tmpRadio.checked = true;
        }
        else
        {
            tmpRadio.checked = false;
        }
    }
    document.all.txthid_GUID.value = rowGUID;
}

12.去掉前后空格

代码如下:

function fn_Trim(obj)
{
    if(obj==null)
    {
       return;
    }
    else
    {
        var oldStr = obj.value;
        var newStr = oldStr.replace(/^\s+|\s+$/g,"");
        obj.value = newStr;
    }     
}

13.TextBox文本内容长度判断 看是否超过长度 超过返回true

代码如下:

function fn_IsTooLong(obj,varLength)
{
    if(obj==null)
    {
       return false;
    }
    else
    {
        var valueStr = obj.value;
        var len = valueStr.match(/[^ -~]/g) == null ? valueStr.length : valueStr.length + valueStr.match(/[^ -~]/g).length ;
        if(len > parseInt(varLength) )
        {
            return true;
        }
        else
        {
            return false;
        }
    }     
}

(0)

相关推荐

  • ASP.NET Calendar日历(日期)控件使用方法

    Calendar 控件显示一个日历,用户可通过该日历导航到任意一年的任意一天.当 ASP.NET 网页运行时,Calendar 控件以 HTML 表格的形式呈现.因此,该控件的许多属性与多种不同的表格格式相符.在这些属性中,有几个在一些低版本的浏览器中不能得到完全支持,因此在这些浏览器中并不能使用所有的格式功能. 使用 Calendar 控件在网页上显示日历的单个月.该控件使您可以选择日期并移到下个月或上个月.Calendar 控件支持 System.Globalization 命名空间中的所有

  • ASP.NET中BulletedList列表控件使用及详解

    BulletedList 控件创建一个无序或有序(编号)的项列表,它们分别呈现为 HTML UL 或 OL 标记.可以指定项.项目符号或编号的外观,可以静态定义列表项或通过将控件绑定到数据来定义列表项,也可以在用户单击项时作出响应. 对于ASP.NET 1.x里要动态显示Bulledted List时,要么自己利用HTML的<ol>或<ul>元素构造,要么就是"杀鸡用牛刀"的动用Repeater来显示.前者过于死板,后者过于Overkill,也许微软听到这种声音

  • ASP.NET中CheckBoxList复选框列表控件详细使用方法

    可以使用两种类型的 ASP.NET 控件将复选框添加到 Web 窗体页上:单独的 CheckBox 控件或 CheckBoxList 控件.两种控件都为用户提供了一种输入布尔型数据(真或假.是或否)的方法. 本文主要介绍CheckBoxList,不言而喻,看到List就知道是一个列表(集合),一个控件可以包含多个CheckBox,下面让我们来看看具体的用法. 1.绑定数据 复制代码 代码如下: this.lngCatalogID.DataSource = dt; //这里我绑到DataTable

  • ASP.NET中DropDownList下拉框列表控件绑定数据的4种方法

    DropDownList Web 服务器控件使用户能够从预定义的列表中选择一项.它与 ListBox Web 服务器控件的不同之处在于,其项列表在用户单击下拉按钮之前一直处于隐藏状态.另外,DropDownList 控件与 ListBox 控件的不同之处还在于它不支持多重选择模式. DropDownList在html中的呈现对应的是select,下面让我们来看一下DropDownList绑定数据的几种方法. 一.把Array数组绑到DropDownList 复制代码 代码如下: string[]

  • ASP.NET中HiddenField隐藏域控件的使用方法

    HiddenField控件的作用简单的说是用于存储需要在向服务器的发送间保持的值.它作为 <input type= "hidden"/> 元素呈现,并且通过添加runat="server"就可以使它成为标准的HTML服务器控件.下面列出的是ASP.NET HiddenField Web服务器控件可以使用的属性和事件. 复制代码 代码如下: <asp:HiddenField     EnableTheming="True|False&quo

  • ASP.NET开发中经常用到10款工具软件介绍

    所谓工欲善其事,必先利其器,老祖宗留下来的话,还是很有道理滴,一款好的工具,可以帮我们提高工作效率,让我们快速完成开发任务. 下面让我一一介绍,如下的十款工具: 1. EditPlus:文字处理软件 EditPlus自然不必所说,想必大家都有了解,它是一款功能强大的文字处理软件.它可以充分的替换记事本,它也提供网页作家及程序设计师许多强悍的功能.支持 HTML.CSS.PHP.ASP.Perl.C/C++.Java.JavaScript.VBScript 等多种语法的着色显示.程序内嵌网页浏览器

  • ASP.NET中FileUpload文件上传控件应用实例

    使用 FileUpload 控件,可以为用户提供一种将文件从用户的计算机发送到服务器的方法.该控件在允许用户上载图片.文本文件或其他文件时很有用.要上载的文件将在回发期间作为浏览器请求的一部分提交给服务器.在文件上载完毕后,您可以用代码管理该文件. 大致了解了一下FileUpload,让我们来看一下FileUpload几个实际应用中问题的处理方法. 1.一次上传多个文件 要一次上传多个文件,我们可以像传单个文件那样对每个文件单独进行处理,除此之外,我们还可以使用HttpFileCollectio

  • ASP.NET中 CheckBox复选框控件的使用

    我们可以使用两种类型的 ASP.NET 控件将复选框添加到 Web 窗体页上:单独的 CheckBox 控件或 CheckBoxList 控件.两种控件都为用户提供了一种输入布尔型数据(真或假.是或否)的方法. 这里我们单独使用CheckBox,先来看看它的属性 属性 描述 .NET AutoPostBack 规定在 Checked 属性已改变后,是否立即向服务器回传表单.默认是 false. 1.0 CausesValidation 规定点击 Button 控件时是否执行验证. 2.0 Che

  • 利用ASP.NET MVC+EasyUI+SqlServer搭建企业开发框架

    我们要搭建的框架是企业级开发框架,适用用企业管理信息系统的开发,如:OA.HR等 1.框架名称:sampleFrame. 2.搭建原则:最少知识原则. 3.先定义一个简单的编码规范:除类名和接口名外,其余首字母小写. 4.准备开发环境:vs2010及以上(mvc4).sqlserver.jquery2.0和easyui1.4.5 首先来看一下列表页面的效果图: 我们期望简洁带前台代码,如下: <table id="dataGrid" class="easyui-data

  • ASP.NET中Validation验证控件正则表达式特殊符号的说明

    RegularExpressionValidator控件表达式说明: 方括号"[ ]"用与定义可接受的字符.[abc123] 表示控件只能接受 a,b,c,1,2,3 这6个字符: 反集合符号 " ^ "用于定义不可以接受的字符.[^a-h] 表示控件除了 a 到 h 8个字符外,都可以接受: 花括号"{ }"定义必须输入的字符个数.{6}表示只能输入6个字符 : {6,}表示必须输入6个以上,无上限 : {2,6} 表示必须输入2至6个字符:但

随机推荐