Question

我想用jquery验证插件显示符号。如果我没有正确输入我的值，jquery验证应该给出错误（没关系）并显示我的自定义符号（.validation-incorrect）。在验证通过后我想要显示.validation-correct符号。怎么做？这是我的代码

<div class="col-xs-4">
   <input type="text" class="form-control" name="roleName" placeholder="Role name" />                       
</div>
<b class="fa fa-check control-label validation-correct roleName-validation" 
                data-toggle="tooltip" title="You have entered it correctly">
</b>
<b class="fa fa-remove control-label validation-incorrect roleName-validation" 
     data-toggle="tooltip" title="You should be entered " id="roleName-validation">
</b>

Answer 1

我假设您要显示无效条目的图标，然后在条目有效时更改。您可能希望首先在要验证的项目中添加onchange事件。使用像

这样的东西

    <input type="text" onchange="validateEntry(this);"/>

触发＆＃34; validateEntry＆＃34; javascript函数（使用this传入控制对象。例如，下面的validateEntry函数验证输入文本是否大于3

    function validateEntry(inputToValidate) {
        if (inputToValidate.value.length < 3) {
            document.getElementById('inputThing').style.backgroundColor = '#F6CECE';
            hide(document.getElementById('validSymbolsId'));
            show(document.getElementById('invalidSymbolsId'));
        } else { 
            document.getElementById('inputThing').style.backgroundColor = '#FFFFFF';
            hide(document.getElementById('invalidSymbolsId'));
            show(document.getElementById('validSymbolsId'));
        }
    }

您可以使用JQuery隐藏或显示元素，但如果您没有，则可以使用以下内容。

    function hide(element) {
        element.style.display = 'none';
    }

    function show(element) {
        element.style.display = '';
    }

使用jquery验证插件显示预定义的HTML元素

1 个答案: