ASP.NET和JavaScript:如何使用具有相同功能的onBlur事件和onclick事件

时间:2013-06-17 06:29:39

标签: javascript asp.net

朋友您好:我打了另一个砖墙。

我在asp.net(非MVC)页面中有以下两个函数:我将函数分开,因为我需要在onBlur事件上使用每个函数,这将简单地调用单独的验证/函数。 验证只使用onBlur事件就可以正常工作,但不能使用按钮进行组合。

示例:让我说我在两个文本框中输入有效条目并单击提交按钮,如果我返回到文本框并重新输入错误值,则onBlur不再有效。< / p>

简而言之,onBlur只有在我不使用按钮时才有效,一旦我这样做,并且函数已经评估为true,那么如果我重新输入错误的值,则onBlur将无效。

注意:我想在进入JQuery之前学习JavaScript的基础知识。

感谢您的帮助!

以下是功能1:

function validateA() {
"use strict";

var element = document.forms["membership"];

var userNameErrorMsg = document.getElementById("lstUserNameErrorMsg");
var userNameTextbox = document.getElementById("txtUserName");
var userNameErrorFlg = document.getElementById("lblUserName");


var isLetters = /^[A-Za-z0-9]+$/;

if (element.txtUserName.value.match(isLetters) && 
element.txtUserName.value.length >= 8) {

userNameErrorMsg.setAttribute("class", "default");
userNameTextbox.className = "";
userNameErrorFlg.className = "";

return true;
}
else {

userNameErrorMsg.setAttribute("class", "error-desc");
userNameTextbox.className = "error-state";
userNameErrorFlg.className = "error-flag";

return false;
}
}

和功能2

function validateB() {
"use strict";

var element = document.forms["membership"];

var passwordErrorDesc = document.getElementById("lstPasswordErrorMsg");
var passwordTextbox = document.getElementById("txtPassword");
var passwordErrorFlg = document.getElementById("lblPassword");


var isNumberLetters = "^[a-zA-Z0-9]*$";

if (!element.txtPassword.value.match(isNumberLetters) && 
element.txtPassword.value.length >= 8) {

passwordErrorDesc.setAttribute("class", "default");
passwordTextbox.className = "";
passwordErrorFlg.className = "";

return true;
}
else {

passwordErrorDesc.setAttribute("class", "error-desc");
passwordTextbox.className = "error-state";
passwordErrorFlg.className = "error-flag";

return false;
}
}

调用这两个函数的函数:

function callBothFunction() {
"use strict";

var isValidFunction = validateA() && validateB();

return isValidFunction;

}

按钮:

<input type="submit" name="btnSubmit" value="Submit Form"
onclick="return callBothFunction();" id="btnSubmit" tabindex="11" />

最后,我在上面单独调用上述两个函数:

<input name="txtUserName" type="text" maxlength="16" 
id="txtUserName" tabindex="4" onblur="validateA();" />


<input name="txtPassword" type="text" maxlength="16" 
id="txtPassword" tabindex="5" onblur="validateB();" />

0 个答案:

没有答案