DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> JS在onclientclick裡如何控制onclick的執行
JS在onclientclick裡如何控制onclick的執行
編輯:關於JavaScript     

OnClientClick是客戶端腳本,一般使用JavaScript,在客戶端,也就是IE中運行,點擊後馬上執行

OnClick是服務器端事件處理函數,使用C#或者vb.net,在服務器端,也就是IIS中運行,點擊按鈕後,執行postback,之後再運行。

若想先調用了OnClientClick後就不在調用OnClick事件,應在OnClientClick事件裡返回false.若不返回false,在執行了OnClientClick後,會繼續調用OnClick事件!

實現方法如下:

<asp:Button ID="btn_Save" runat="server" Text="保存" CssClass="button_bak" OnClientClick="return whetherEmpty();" OnClick="btn_Save_Click" />
//JavaScript實現如下:
<script language="javascript" type="text/javascript">
function whetherEmpty()
{
//alert("KPI信息不能全為空!");
emptflag = false ;
var kpiName = document.getElementById("<%=txt_KPIName.ClientID%>").value;
var jobgoal = document.getElementById("<%=txt_JobGoal.ClientID%>").value;
var weight = document.getElementById("<%=txt_Weight.ClientID%>").value;
var standard = document.getElementById("<%=txt_Standard.ClientID%>").value;
if (kpiName == "" && jobgoal == "" && weight =="" && standard =="")
{
emptflag = true ;
}
if (emptflag)
{
alert("KPI信息不能全為空!");
return false;
}
}
</script>

若是OnClientClick="return whetherEmpty();" 沒有return ,在JavaScript裡即使return fales,onclick依然會執行!

下面給大家介紹onclientclick和onclick區別

其實有的時候需要客戶端和服務端雙重校驗,為什麼這麼說呢? 比果說,一個用戶名的文本框,在客戶端我們通過JS校驗,只能輸入字母和數字,不能有特殊字符!通常情況下是沒有問題的,但是總有那麼一丟丟人想方設法的去“搞破壞” ,這個時候就需要進行雙重校驗了!說白了,就是服務端和客戶端都進麼校驗!

比如說:Button有:OnClick事件和OnClientClick屬性,前者一般就是服務端的點擊事件!後者則是客戶端的點擊事件!

我們來做一個測試!在Default.aspx頁面中添加如下代碼!

<script language="javascript" type="text/javascript">
function buttonClick() {
alert("我是客戶端點擊事件");
return false; 
}
</script> 

頁面代碼:

<form id="form1" runat="server">
<div>
<asp:Button ID="Button1" runat="server" Text="些Button是服務端控件,默認使用OnClientClick事件,請禁用浏覽器的Js功能體驗"
OnClick="Button1_Click" OnClientClick="return buttonClick();" />
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</div>
</form> 

cs文件代碼:

protected void Button1_Click(object sender, EventArgs e)
{
this.Label1.Text = "我是服務端點擊事件";
}

大家運行看看是什麼效果? 你可能會發現,只彈出了JS中的代碼! 沒錯,這正是我們想要的效果,通過return false 來"屏蔽"服務端的校驗!好處是什麼? 就是不用刷新頁面呀!

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved