jquery形式BASIC验证问题

Question

我正在尝试验证表单,如果输入字段中没有文本,则会弹出错误图标...如果输入中有ANYTHING,则会弹出一个成功图标.没有使用真正的验证方法.你可以在这里看到表格.

如您所见,当您在第一个字段中键入内容并按Tab键时,图标会正确弹出,但在第一个字段后面的任何字段都不起作用.这是我的jquery:

<script type="text/javascript">
        $(function(){
        var field = document.getElementById('myFormField');
        var icon = document.getElementById('myIcon');

        field.onchange = function(){
            icon.src = this.value ? 'success.png' : 'fail.png';
        };
        });
</script>

我不知道如何在所有输入字段上工作,但我确定这是一个简单的修复.我的HTML设置如下:

<input type="text" class="name" name="name" tabindex="1" id="myFormField"  /><img id="myIcon" />

id myFormfield触发图标,类"name"触发单击后台.我认为我应该坚持使用该类,并尝试将其作为此解决方案的一部分.有任何想法吗？

Answer 1

你并没有真正使用jQuery的强大功能.尝试这样的事情:

$(function(){
    $(':text,:textarea').bind('change, blur',function(){
        $(this).next('img').attr('src',this.value ? 'success.png' : 'fail.png');
    });
});