jQuery焦点不在输入框内判断不能为空

我能说JS和jquery有时候都有病吗?同样的代码,重敲一遍可以了,再过一会不行了。再试一下重敲,一模一样的代码,也不报错。就是不行。反复折腾。。。。

我帖上来的是经过了1个小时同等功能的测试OK的,无语了。。。。。

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<link type="text/css" rel="stylesheet" href="../css/style.css">
<script type="text/javascript" src="../js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="../ckeditor/ckeditor.js"> </script>
<script type="text/javascript">
        $(document).ready(function(){
            //供应商输入框判断

            /* 焦点离开文本框 */
            $("#proName").blur(function(){
                if($("#proName").val().length==0){
                    $("#proName_span").html("供应商不能为空");

                }
            });
            $("#proName").focus(function(){
                $("#proName").css("background-color","#FFFFCC");
                $("#proName_span").html("");
            });
            //联系人为空输入框判断
            /*  焦点在文本框内*/
            $("#proContact").focus(function(){
                $("#proContact").css("background-color","#FFFFCC");
                $("#proContact_span").html("");
            });
            /!* 焦点离开文本框 *!/
            $("#proContact").blur(function(){
                $("#proContact").css("background-color","#D6D6FF");
                if($(this).val().length==0){
                    $("#proContact_span").html("联系人不能为空");

                }
            });
            //联系电话为空输入框判断
            /!*  焦点在文本框内*!/
            $("#proPhone").focus(function(){
                $("#proPhone").css("background-color","#FFFFCC");
                $("#proPhone_span").html("");
            });
            /* 焦点离开文本框 */
            $("#proPhone").blur(function(){
                $("#proPhone").css("background-color","#D6D6FF");
                if($(this).val().length==0){
                    $("#proPhone_span").html("联系电话不能为空");

                }
            });

          
        })
    </script>
</head>
<body>
<div class="main">
    <div class="optitle clearfix">
        <div class="title">供应商管理&gt;&gt;</div>
    </div>
    <form id="form1" name="form1" method="post" action="<%=request.getContextPath()%>/addProvider">
        <input type="hidden" name="method" value="add">
        <div class="content">
            <table class="box">
               <tbody><tr>
                    <td class="field">供应商名称:</td>
                    <td><input type="text" name="proName" class="text" id="proName" value=""/> <span color="red">*</span><span color="red" id="proName_span"></span></td>
                </tr>
                 <tr>
                    <td class="field">联系人:</td>
                    <td><input type="text" name="proContact" class="text" id="proContact" value=""/> <span color="red">*</span><span color="red" id="proContact_span"></span></td>
                </tr>
                <tr>
                    <td class="field">联系电话:</td>
                    <td><input type="text" name="proPhone" class="text" id="proPhone" value=""/> <span color="red">*</span><span color="red" id="proPhone_span"></span></td>
                </tr>
                <tr>
                    <td class="field">联系地址:</td>
                    <td><input name="proAddress" id="proAddress" class="text" value=""/></td>
                </tr>
               <tr>
                    <td class="field">传真:</td>
                    <td><input type="text" name="proFax" class="text" id="proFax" value=""/> </td>

                </tr>
                 <tr>
                    <td class="field">描述:</td>
                    <td><textarea id="proDesc" name="proDesc" rows="8" cols="5" class="ckeditor"></textarea></td>

                </tr>
            </tbody></table>
        </div>
        <div class="buttons">
            <input type="button" name="add" id="add" value="保存" class="input-button"/>
            <input type="button" name="button" id="button" onclick="history.back(-1)" value="返回" class="input-button"/> 
        </div>

    </form>
</div>
<script type="text/javascript" src="../js/provider/add.js"></script>


</body></html>

 

posted @ 2016-09-27 20:13  sincoolvip  阅读(912)  评论(0编辑  收藏  举报