Javascript和jQuery在Grails应用程序中停止工作

Javascript and jQuery stopped working in Grails application

本文关键字：应用程序 停止工作 Grails jQuery Javascript      更新时间：2023-09-26

我在Grails应用程序中遇到了一件非常奇怪的事情，所有的Javascript和jQuery都停止了工作，即使是像这样简单的事情也无法工作或执行，我尝试了"清理"answers"刷新依赖项"，但没有改变：

<script type="text/javascript">
 alert ("Hi");
</script>

以下是生成的内容：

<!DOCTYPE html>
 <!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
 <!--[if IE 7 ]>    <html lang="en" class="no-js ie7"> <![endif]-->
 <!--[if IE 8 ]>    <html lang="en" class="no-js ie8"> <![endif]-->
 <!--[if IE 9 ]>    <html lang="en" class="no-js ie9"> <![endif]-->
 <!--[if (gt IE 9)|!(IE)]><!-->
<html lang="en" class="no-js">
<!--<![endif]-->
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>Insert title here</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1">
    <link rel="shortcut icon" href="/myApp/assets/FB_favicon.png"
    type="image/x-icon">
    <link rel="apple-touch-icon"
    href="/myApp/assets/apple-touch-icon.png">
    <link rel="apple-touch-icon" sizes="114x114"
    href="/myApp/assets/apple-touch-icon-retina.png">
    <link rel="stylesheet" href="/myApp/assets/main.css?compile=false"  />
    <link rel="stylesheet" href="/myApp/assets/mobile.css?compile=false"  />
    <link rel="stylesheet" href="/myApp/assets/application.css?compile=false"  />
    <script src="/myApp/assets/jquery/jquery-1.11.1.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/jquery.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/JqueryCalender.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/JqueryPaymentPlugin.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/JqueryValidationPlugin.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/adsValidation.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/alertify.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/alertify.min.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/jquery.growl.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/jquery.session.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/photosValidation.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/test.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/utils.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/wordCharacterCounter.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/assets/application.js?compile=false" type="text/javascript" ></script>
    <script src="/myApp/js/stripe-v2.js" type="text/javascript"></script>

    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
    <meta name="layout" content="main"/>
    <script type="text/javascript">
        $(document).ready(function(){
            alert("Hiiii");
        });
    </script>
</head>
<body>

    <div id="grailsLogo" role="banner"><a href="http://grails.org"><img src="/myApp/assets/FB_Logo.png" alt="test"/></a> </div>
    <head>
        <script src="/myApp/assets/jquery.session.js?compile=false" type="text/javascript" ></script>
    </head>
    <div style="padding-left: 30px;padding-bottom: 50px;transform:scale(1.5,1.5);transform-origin:0 0;">Languages :
        <div id="lang_selector" class="lang_selector">
            <a href="/myApp/grails/ads/test.dispatch?lang=ar_EG" title="Change language." class="lang_link">
                <span class="lang_flag opacitiy_not_selected">
                    <img alt="" src="/myApp/static/plugins/lang-selector-0.3/images/flags/png/eg.png" border="0">
                </span>
            </a>
            <a href="/myApp/grails/ads/test.dispatch?lang=en_US" title="Change language." class="lang_link">
                <span class="lang_flag ">
                    <img alt="" src="/myApp/static/plugins/lang-selector-0.3/images/flags/png/us.png" border="0">
                </span>
            </a>
        </div> </div>
        <div id='cssmenu'>
            <ul class="navbar-nav navbar-right">

                <li><a href="/myApp/users/logout">
                    <b><u>Logout</u></b>
                </a></li>
            </ul>


        </div>

        <div class="welcomeMenu"><a href="/myApp/users/edit/1"> Welcome , user </a></div>
        <div class="body">
        </div>

    </div>
    <div id="spinner" class="spinner" style="display:none;">Loading&hellip;</div>
</body>
</html>

是什么原因导致了这种奇怪的行为？

首先要证明JavaScript确实有效。要做到这一点，请将您的测试从…更改为。。。

<script type="text/javascript">
    $(document).ready(function(){
        alert("Hiiii");
    });
</script>

到…

<script type="text/javascript">
    alert("Hiiii");
</script>

该更改将使您的测试绕过jQuery。

在验证了普通的旧JavaScript是否正常工作后，您就可以处理jQuery问题了。也就是说，你要加载两次jQuery：

<script src="/myApp/assets/jquery/jquery-1.11.1.js?compile=false" type="text/javascript" ></script>
<script src="/myApp/assets/jquery.js?compile=false" type="text/javascript" ></script>

看起来您已经有了jQuery的第二个副本，资产管道正在收集它。

相关文章：