js jQuery 动态校验表单输入框内容

1,需要完成的功能

(1)在输入框中输入重复的字段值时

 

(2)当光标跳出此输入框时

2,实现代码

(1)html

<td class="inputLabelTd">活动标识码:</td>
                    <td class="inputTd">
                        <input id="edit_activityCode" name="activityCode" type="text" class="text"/>
                        <span id="uniqueNote" style="color:red;display:none;">活动标识码不能重复</span> 
                        <span id="NullNote" style="color:red;display:none;">活动标识码不能为空</span> 
                    </td>

(2)js

/*添加标识码校验是否唯一*/
        $("#edit_activityCode").bind("blur",function(){
            var actCode=$(this).val();
            if(actCode !=""){
                 $("#uniqueNullNote").css("display","none");
                 /*异步请求活动标识码是否唯一*/
                $.ajax({
                    url : "jfOperationActivity/checkActivityCode/"+actCode,
                    
                    dataType : "json",
                    success : function(data) {
                            if(data !=null){
                                $("#uniqueNote").css("display","inline-block");
                            }else{
                                $("#uniqueNote").css("display","none");
                            }
                    }
                });
                }else{
                  $("#uniqueNote").css("display","none");
                  $("#NullNote").css("display","inline-block");
                  return;
            }
            
        });

3,注:(1)success中的回调函数,由于我是根据输入框的值查询数据库中是否有数据,来做出提示。这里的后台逻辑可以自由实现

           (2)//标识码不进行动态验证--取消绑定blur事件  

                 $('#edit_activityCode').unbind();

 

posted @ 2015-08-19 17:03  abc红泡泡  阅读(1377)  评论(0编辑  收藏  举报