關於引入多個jquery沖突的問題(附一個很好用的validate前端驗證框架及使用方法)


廢話不多說,進入正題:

如果一個jsp中想要使用兩個不同版本的jquery怎么辦呢?客官往下看:

<script src="${ctxStatic}/jquery/jquery-1.8.3.min.js" type="text/javascript"></script>

    <script src="${ctxStatic}/formValidator.2.5.2/js/jquery-1.6.min.js" type="text/javascript"></script>

如果我想使用1.8.3版本的jquery

那么就在引入1.8.3的<script></script>下面加上如下代碼:

<script>
    var jq = $.noConflict();
    jq(document).ready(function(){
            // binds form submission and fields to the validation engine
            jq("#aaab").validationEngine();
            
        });
    </script>

記住一定要緊挨着引入1.8.3的js

如果放在1.6版本下面,那么所定義的jq就是1.6版本的了

當然,如果我們的項目是通過include標簽引入的全局jquery 而當前jsp頁面又新引入了一個jquery,那么上段代碼放在什么位置都是無所謂的,所定義的jq都是當前頁面新引入的jquery

下面是例子:(一個很方便的validate前端驗證:想要使用驗證直接引入下列文件:)

    <link rel="stylesheet" href="${ctxStatic}/formValidator.2.5.2/css/validationEngine.jquery.css" type="text/css"/>
    <link rel="stylesheet" href="${ctxStatic}/formValidator.2.5.2/css/template.css" type="text/css"/>


    <script src="${ctxStatic}/formValidator.2.5.2/js/jquery-1.6.min.js" type="text/javascript"></script>

    <script src="${ctxStatic}/formValidator.2.5.2/js/languages/jquery.validationEngine-zh_CN.js" type="text/javascript" charset="utf-8">
    </script>
    <script src="${ctxStatic}/formValidator.2.5.2/js/jquery.validationEngine.js" type="text/javascript" charset="utf-8">
    </script>

然后在需要驗證的表單class加上validate[required] (必填項驗證)

    <form action="www.baidu.com" id="aaab" method="post">
    <input type="text" value="" placeholder="請輸入姓名" class="validate[required] validate[email]"/>
    <input type="submit" value="提交"/>
</form>

下面是我代碼放置位置以及前端頁面展示圖:

    <link rel="stylesheet" href="${ctxStatic}/formValidator.2.5.2/css/validationEngine.jquery.css" type="text/css"/>
    <link rel="stylesheet" href="${ctxStatic}/formValidator.2.5.2/css/template.css" type="text/css"/>
<script src="${ctxStatic}/jquery/jquery-1.8.3.min.js" type="text/javascript"></script>

    <script src="${ctxStatic}/formValidator.2.5.2/js/jquery-1.6.min.js" type="text/javascript"></script>
        <script>
    var jq = $.noConflict();
    jq(document).ready(function(){
            // binds form submission and fields to the validation engine
            jq("#aaab").validationEngine();
            
        });
    </script>
    <script src="${ctxStatic}/formValidator.2.5.2/js/languages/jquery.validationEngine-zh_CN.js" type="text/javascript" charset="utf-8">
    </script>
    <script src="${ctxStatic}/formValidator.2.5.2/js/jquery.validationEngine.js" type="text/javascript" charset="utf-8">
    </script>

    <link rel="stylesheet" href="${ctxStatic}/formValidator.2.5.2/css/validationEngine.jquery.css" type="text/css"/>
    <link rel="stylesheet" href="${ctxStatic}/formValidator.2.5.2/css/template.css" type="text/css"/>
<script src="${ctxStatic}/jquery/jquery-1.8.3.min.js" type="text/javascript"></script>

        <script>
    var jq = $.noConflict();
    jq(document).ready(function(){
            // binds form submission and fields to the validation engine
            jq("#aaab").validationEngine();
            
        });
    </script>
    <script src="${ctxStatic}/formValidator.2.5.2/js/jquery-1.6.min.js" type="text/javascript"></script>
    <script src="${ctxStatic}/formValidator.2.5.2/js/languages/jquery.validationEngine-zh_CN.js" type="text/javascript" charset="utf-8">
    </script>
    <script src="${ctxStatic}/formValidator.2.5.2/js/jquery.validationEngine.js" type="text/javascript" charset="utf-8">
    </script>

可以看到我把定義jq的代碼放在1.8.3版jquery下面就完全失去效果了(我的這個validate前端驗證框架是不支持1.8.3版jquery的)

下面是我的驗證框架傳送門:

 

 

 http://files.cnblogs.com/files/fengwenzhee/formValidator.2.5.2.rar

 

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM