javascript - 如何使用 javascript 或 jquery 添加验证来控制？

Question

我想在下面的控件中添加验证：任何人都可以告诉我用 jquery 或 javascript 来做吗

<table width="100%" border="0">
                    <tbody>

                    <tr>
                        <td>UserName: <span>*</span></td>
                        <td>
                            <input type="text" name="userName" value=""  size="40">                
                         </td>
                    </tr>

                     <tr>
                        <td>Display Name: <span>*</span></td>
                        <td><input type="text" name="name" value=""  size="40" >
                        </td>
                    </tr>


             </tbody>
             </table>

Answer 1

使用jquery 验证：

<input data-val="true" data-val-length="Name is too long. Max length is 40 chars" data-val-length-max="40" name="name" type="text" value="">

JS：

$(".yourTableSelector").validate();

Answer 2

您也可以使用jQuery.post()。设置这两个输入的 ID，然后在 JavaScript 中：

$.post("validation.php", { username: $("#usernameInputID").val(), displayName: $("#displayNameInputID").val() }).done(function(data) {
    //Some code (if invalid, fox example set border to red etc...)
});

在validation.php中，您可以检查接收到的字符串是否为空，用户名是否唯一等，并根据此返回一些值（带有简单的回显），您可以在JavaScript中使用它来决定输入是否正确......您可以检查每个输入单，然后您可以提醒用户只有某些字段未正确填写。

Answer 3

$("input[name='userName']").change(function(){
    if($(this).val()==""){
       alert('This field cannot be empty');
    }
});

$("input[name='name']").change(function(){
    if($(this).val()==""){
       alert('This field cannot be empty');
    }
});