如何将文本框（不是文本框的值）传递给 Javascript 验证函数答案

【问题标题】：How to pass a textbox (not the value of textbox) to Javascript validate function如何将文本框（不是文本框的值）传递给 Javascript 验证函数
【发布时间】：2012-12-30 05:34:14
【问题描述】：

我有一个 HTML 格式的注册表单。我想使用 JavaScript 验证它。我想将文本框（不是值）传递给 JavaScript，这样我就不必多次编写 document.getElementById("Textname").value 了。我希望我的 JavaScript 函数获取 HTML 活动控件，或者将控件传递给函数。

我的 HTML 代码：

<i>table>
    <tr><td>
     First Name</td>><td><input type="text" id="fname" runat="server"  /></td></tr>
    <tr><td>last Name</td>><td><input type="text" id="lname" runat="server"  /></td></tr>
    <tr><td>Phone</td>><td><input type="text" id="phone" runat="server" /></td></tr>
    <tr><td>email</td>><td><input type="text" id="email" runat="server" /></td></tr>
    <tr><td>password</td>><td><input type="password" id="pass" runat="server" /></td></tr>
    <tr><td>image</td>><td><input type="file" id="image" runat="server" /></td></tr>
    <tr><td rowspan="2">Sex</td>><td>Male<input type="radio" id="male"  runat="server" value="male" /></td></tr>
    <tr><td colspan=".5">female<input type="radio" runat="server" id="female" /></td></tr>
    <tr><td>submit</td>><td><input type="submit" id="submit" runat="server"  value="SUBMIT"/></td></tr>
    <tr><td>reset</td>><td><input type="reset" id="res" runat="server" /></td></tr>
    <tr><td><button id="save" runat="server" value="save" ></button></td></tr>
    </table><i/>

JavaScript 代码：

function cont(textbox) 
{

    var name=document.getelementbyId(textbox).value;
    var illegalChars = /[\(\)\<\>\,\;\:\\\"\[\]]/;
    var regletter = /[a-zA-z]/;
    if (uname == "")
    {
        alert("please enter ");
        document.getelementbyid(textbox)style.background = "grey";
        document.getElementById(textbox).focus;
    }

【问题讨论】：

function textbox(id) { return document.getElementById(id).value; }
@Oli 你在音量控制方面打败了我。

标签： javascript html function validation textbox

【解决方案1】：

您可以将其存储到一个var中，这样您就不必多次使用document.getElementById。

var element = document.getElementById(textbox);
var name = element.value;
var illegalChars = /[\(\)\<\>\,\;\:\\\"\[\]]/;
var regletter = /[a-zA-z]/;
if (uname == "") // are you sure it's `uname` and not `name` ?
 {
    alert("please enter ");
    element.background = "grey";
    element.focus();
}

【讨论】：

【解决方案2】：

不检查您提供的代码的有效性，解决方案相当简单：

function cont(textbox) 
{

    var name = textbox.value;
    var illegalChars = /[\(\)\<\>\,\;\:\\\"\[\]]/;
    var regletter = /[a-zA-z]/;
    if (uname == "") {
        alert("please enter ");
        textbox.style.background = "grey";
        textbox.focus;
    }
    // ...
}

// execute the function
cont(document.getElementById('Textname'));

【讨论】：

【解决方案3】：

得到了答案。为避免使用重复代码，请使用 'this'。 'this' 指的是当前控件。下面是一个使用它的小例子。

     <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script type="text/javascript" >
        function chk(a) { 

            alert(a.value);

        }


    </script>
    <title></title>
</head>
<body>
    <form id="f1" method="post" action="Default.aspx" >
    <input type="text" id="num1"  onblur="chk(this)"  />
    </form>
</body>
</html>

【讨论】：