无法使JQuery正常工作

时间:2016-01-12 01:45:21

标签: javascript jquery html css

我有一个我在这里上传的代码可以正常使用http://codepen.io/David17k7/pen/EPXbMP但是当我将其上传到我的网站时,它无法正常工作。 https://www.hostcactus.com

HTML:

<script src="templates/{$template}/js/whmcs.js"></script>
<link href="templates/{$template}/css/bootstrap2.css" rel='stylesheet' type='text/css' />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="templates/{$template}/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="templates/{$template}/js/jquery.leanModal.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" />
<link type="text/css" rel="stylesheet" href="templates/{$template}/css/loginbox.css" />
<!-- Custom Theme files -->
<link href="templates/{$template}/css/style.css" rel='stylesheet' type='text/css' />
<!-- Custom Theme files -->
<!-- webfonts -->
<link href='//fonts.googleapis.com/css?family=Lato:100,300,400,700,900' rel='stylesheet' type='text/css'>
<!-- webfonts -->
<!-- dropdown -->
<script src="templates/{$template}/js/jquery.easydropdown.js"></script>
<!-- Add fancyBox main JS and CSS files -->
<script src="templates/{$template}/js/jquery.magnific-popup.js" type="text/javascript"></script>
<link href="templates/{$template}/css/popup.css" rel="stylesheet" type="text/css">
    {$headoutput}

  </head>

  <body>
{$headeroutput}
<div class="header">
    <div class="container">
      <div class="header_bottom"> 
       <div class="col-xs-3 logo">
         <a href="index.php"><img src="templates/{$template}/img/logo.png" alt=""/></a>
       </div>
       <div class="col-xs-9 header_nav">
           <div class="col-xs-9 menu">
                    <a class="toggleMenu" href="#"><img src="templates/{$template}/img/nav_icon.png" alt="" /> </a>
                    <ul class="nav" id="nav">
                      <li class="current"><a href="https://www.hostcactus.com/">Home</a></li>
                      <li><a href="about.html">About Us</a></li>
                      <li><a href="services.html">Services</a></li>
                      <li><a href="404.html">Feedback</a></li>
                      <li><a href="support.html">Support</a></li>
                      {if $logged_in} {else}
                      <li><a href="register.php">Register</a></li>
                      {/if}                             
                    </ul>
                    <script type="text/javascript" src="templates/{$template}/js/responsive-nav.js"></script>
          </div>
          <div class="col-xs-3 header_but">
              <menu class="cl-effect-8" id="cl-effect-8">


<div class="container">
  <h1>Popup Login & Signup with jQuery</h1>
  <a id="modal_trigger" href="#modal" class="btn">Click here to Login or register</a>

  <div id="modal" class="popupContainer" style="display:none;">
    <header class="popupHeader">
      <span class="header_title">Login</span>
      <span class="modal_close"><i class="fa fa-times"></i></span>
    </header>

    <section class="popupBody">
      <!-- Social Login -->
      <div class="social_login">
        <div class="">
          <a href="#" class="social_box fb">
            <span class="icon"><i class="fa fa-facebook"></i></span>
            <span class="icon_title">Connect with Facebook</span>

          </a>

          <a href="#" class="social_box google">
            <span class="icon"><i class="fa fa-google-plus"></i></span>
            <span class="icon_title">Connect with Google</span>
          </a>
        </div>

        <div class="centeredText">
          <span>Or use your Email address</span>
        </div>

        <div class="action_btns">
          <div class="one_half"><a href="#" id="login_form" class="btn">Login</a></div>
          <div class="one_half last"><a href="#" id="register_form" class="btn">Sign up</a></div>
        </div>
      </div>

      <!-- Username & Password Login form -->
      <div class="user_login">
        <form>
          <label>Email / Username</label>
          <input type="text" />
          <br />

          <label>Password</label>
          <input type="password" />
          <br />

          <div class="checkbox">
            <input id="remember" type="checkbox" />
            <label for="remember">Remember me on this computer</label>
          </div>

          <div class="action_btns">
            <div class="one_half"><a href="#" class="btn back_btn"><i class="fa fa-angle-double-left"></i> Back</a></div>
            <div class="one_half last"><a href="#" class="btn btn_red">Login</a></div>
          </div>
        </form>

        <a href="#" class="forgot_password">Forgot password?</a>
      </div>

      <!-- Register Form -->
      <div class="user_register">
        <form>
          <label>Full Name</label>
          <input type="text" />
          <br />

          <label>Email Address</label>
          <input type="email" />
          <br />

          <label>Password</label>
          <input type="password" />
          <br />

          <div class="checkbox">
            <input id="send_updates" type="checkbox" />
            <label for="send_updates">Send me occasional email updates</label>
          </div>

          <div class="action_btns">
            <div class="one_half"><a href="#" class="btn back_btn"><i class="fa fa-angle-double-left"></i> Back</a></div>
            <div class="one_half last"><a href="#" class="btn btn_red">Register</a></div>
          </div>
        </form>
      </div>
    </section>
  </div>
</div>
              </menu>   
          </div>
          <div class="clearfix"></div>      
      </div>
      <div class="clearfix"></div>
      </div>
   </div>

我无法弄清楚它有什么问题。任何有关这方面的帮助将非常感激,因为我总是吮吸Javascript和JQuery。谢谢!

1 个答案:

答案 0 :(得分:0)

我不能说我确切地知道你要完成什么,但我的猜测是因为源文件路径不完整所以没有任何工作。

<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/jquery.leanmodal/1.1/jquery.leanmodal.min.js"></script>

使用正确的文件路径,我能够看到一个要求我注册的模式。