Question

我的Jquery在线工作正常但是当我尝试将其设置为外部时它似乎不起作用。我有两个脚本存储在：include（'./ includes / header.html'）; 我还将它们存储在文件夹的根目录中。

如果有人能提供帮助就会很棒。

我在header.html中有两个链接

 <!DOCTYPE html>
  <head>
   <title> <?php $page_title ?> </title>

<link rel="stylesheet" type="text/css" href="mystyle.css">

<script src="formValidation.js"></script>
<script src="jquery-1.10.2.js"></script>



</head>
<body>
<div id="wrapper">

    <div id="header">
        <h1>Films.com</h1>

    </div>

    <div id="content">

        <div id="nav">

            <ul>
                <li><a href="login.php">Login</a></li>
                <li><a href="index.php">Home</a></li>
                <li><a href="register.php">Register</a></li>
                <li><a href="film.php">Film</a></li>
                <li><a href="add_film.php">Add a Film</a></li>


            </ul>

        </div>

当转到add_film.php时，Jquery通常会滑下我的表单，现在它不会向下滑动。

  <?php

     include('./includes/header.html');




echo "<h1>Add A film</h1>";

 if(isset($_POST['submitted'])){

$errors = array(); // Initialize erroy array.

// Check for title.
if (empty($_POST['movie_title'])){
    $errors[] = "You forgot to enter a title.";
} else {
    $mn = (trim($_POST['movie_title']));
}
// Check for leading actor
if (empty($_POST['leading_actor'])){
    $errors[] = "You forgot to enter the leading actor.";
} else {
    $la = (trim($_POST['leading_actor']));
}
// Check for a rating
if (empty($_POST['rating'])){
    $errors[] = "Please select a rating.";
} else {
    $rating = ($_POST['rating']);
}
// Check for a review
if (empty($_POST['review'])){
    $errors[] = "Please write a review";
} else {
    $review = (trim($_POST['review']));
} 


if (empty($errors)) { // If no errors were found.

    require_once('./includes/Mysql_connect.php');

    // Make the insert query.
    $query = "INSERT INTO films (movie_title, actor, rating)
    Values ('$mn', '$la', '$rating' )";

    $result = mysql_query($query);

    $id = mysql_insert_id();

    $query = "INSERT INTO reviewed (review, movie_id)
    values ('$review', '$id')";

    $result = mysql_query($query);



    //Report errors.
} else {
    foreach ($errors as $msg){
        echo " - $msg <br/> ";
    }
 }

}

＆GT;

<html>


<form action="add_film.php" method="post" id="add_film">

    <fieldset>

    <label for="title">Movie Title</label>
    <input type="text" name="movie_title" id="movie_title" />

    <br/>
    <br/>

    <label for="actor">Leading Actor</label>
    <input type="text" name="leading_actor" id="leading_name" />

    <br/>
    <br/>      


    <label for="rating">Rating</label>
    <select id="rating" name="rating"/>
        <option selected="selected" value=0 disabled="disabled">Select a                     Rating</option>
        <option value="Terrible">Terrible</option>
        <option value="Fair">Fair</option>
        <option value="Ok">Ok</option>
        <option value="Good">Good</option>
        <option value="Excellent">Excellent</option>
    </select>

    <br/>
    <br/>


    <label for="review">Your Review</label>
    <br/>
    <textarea name="review" id="review" rows="15" cols="60"></textarea>

    <br/>
    <br/>

    <input type="submit" name="submit" id="submit" value="submit" />
    <input type="hidden" name="submitted" value="TRUE" />

    </fieldset>
 </form>







    <br/>
 </html>







 <?php

 include('./includes/footer.html');

  ?>

这是我的Jquery。

 $(document).ready(function(){


    $('#add_film').slideDown(800);

    // Focus on first form field.
    $("input:text:visible:first").focus();


    $('#add_film').submit(function (e) {

    var error = false;

    // No value for movie_title
    if ($('#movie_title').val() == "") {
        alert("No Film");
        error = true;
    }

    // No Value for actor
    if ($('#leading_name').val() == "") {
        alert("No actor");
        error = true;
    }

    // No value for rating
    if ($('#rating').val() == null) {
        alert("No Rating");
        error = true;
    }

    //No value for review
    if ($('#review').val() == "") {
        alert("No review");
        error = true;
    }



    if (error) {
        e.preventDefault();
      }
   });
});

Answer 1

更改加载顺序：

<script src="jquery-1.10.2.js"></script>
<script src="formValidation.js"></script>

Answer 2

加载脚本的顺序很重要。由于您的脚本使用jquery，因此需要在脚本之前加载jquery。所以改变加载的顺序。首先加载jquery，然后加载你的脚本。

这也是为什么你的脚本内联工作的原因。

JavaScript / Jquery文件未加载

2 个答案: