Question

我是Java和它的模块的新手，并且相信我已经按照我发现的指令来制作这个动画形式而其他人运行，但我似乎无法使它们工作。

对于主要注册表单，我使用https://codepen.io/atakan/pen/gqbIz/中的模板，稍微修改文本后，将元素复制到三个文件：/test.php - /index_style.css和javascript。 JS

以下代码就是我所拥有的：

<html>
    <head>
        <title>Flight One | Flying Passion</title>
        <link rel="stylesheet" href="/CSS/index_style.css" style="text/css">
        <link rel="stylesheet/less" type="text/css" href="/CSS/styles.less" />
        <script src="//cdnjs.cloudflare.com/ajax/libs/less.js/3.0.0/less.min.js" ></script>
        <script src="/US/en/local/Ressources/Java/javascript.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
    </head>
    <body>
        <form id="msform">
                                    <!-- progressbar -->
                                  <ul id="progressbar">
                                    <li class="active">Account Setup</li>
                                    <li>Social Profiles</li>
                                    <li>Personal Details</li>
                                  </ul>
                                  <!-- fieldsets -->
                                  <fieldset>
                                    <h2 class="fs-title">Create your account</h2>
                                    <h3 class="fs-subtitle">This is step 1</h3>
                                    <input type="text" name="email" placeholder="Email" onkeypress="return isNumberKey(event)" />
                                    <input type="password" name="pass" placeholder="Password" />
                                    <input type="password" name="cpass" placeholder="Confirm Password" />
                                    <input type="button" name="next" class="next action-button" value="Next" />
                                  </fieldset>
                                  <fieldset>
                                    <h2 class="fs-title">Social Profiles</h2>
                                    <h3 class="fs-subtitle">Your presence on the social network</h3>
                                    <input type="text" name="twitter" placeholder="Twitter" />
                                    <input type="text" name="facebook" placeholder="Facebook" />
                                    <input type="text" name="gplus" placeholder="Google Plus" />
                                    <input type="button" name="previous" class="previous action-button" value="Previous" />
                                    <input type="button" name="next" class="next action-button" value="Next" />
                                  </fieldset>
                                  <fieldset>
                                    <h2 class="fs-title">Personal Details</h2>
                                    <h3 class="fs-subtitle">We will never sell it</h3>
                                    <input type="text" name="fname" placeholder="First Name" />
                                    <input type="text" name="lname" placeholder="Last Name" />
                                    <input type="text" name="phone" placeholder="Phone" />
                                    <textarea name="address" placeholder="Address"></textarea>
                                    <input type="button" name="previous" class="previous action-button" value="Previous" />
                                    <input type="submit" name="submit" class="submit action-button" value="Submit" />
                                  </fieldset>
                                </form>
    </body>
</html>

我复制的CSS代码与模板中完全相同，并将完全相同的java脚本插入到我的javascript.js文件中。

当我使用像“upperCaseF（this）”这样的简单java函数时，它从链接文件运行，但不运行其他函数..

我真的四处寻找解决方案但仍然不明白为什么它会在他们的模拟器上运行但不在我身边。

我正在使用Sublime Text和MAMP，但即使我将其上传到我的网站也不起作用......

感谢您的帮助！

Answer 1

在加载框架之前，您正在加载jquery代码。

您的标题应如下所示：

    <head>
    <title>Flight One | Flying Passion</title>
    <link rel="stylesheet" href="/CSS/index_style.css" style="text/css">
    <link rel="stylesheet/less" type="text/css" href="/CSS/styles.less" />
    <script src="//cdnjs.cloudflare.com/ajax/libs/less.js/3.0.0/less.min.js" ></script>
    <!-- TODO Verify what version of jquery is needed -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <!-- TODO Verify what version of jquery is needed -->
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>

    <!-- loading custom jquery code here -->
    <script src="/US/en/local/Ressources/Java/javascript.js"></script>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

此外，您应该将自定义事件添加到自定义代码中（在这种情况下，因为您将其加载到标头标记中），如下所示（如果您还没有这样做）：

$(document).ready(function() {
    // TODO Add your jQuery code in here.
});

实现jQuery动画表单

1 个答案: