-2

好的，它确实在 PHP 中工作，但如果我修改文件，使我的 index.php 看起来像这样

<?php

include('header');
include('main_content');
include('footer');

?>

然后它不起作用。

这是我渲染的 hmtl (firefox)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=MacRoman">
<title>This is a test page</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
<script type="text/javascript" src="js/jquery.validate.js"></script>
<script src="js/jquery.min.js" ></script>
<script src="js/main.js" ></script>
<LINK href="css/other1.css" rel="stylesheet" type="text/css">
<LINK href="css/other2.css" rel="stylesheet" type="text/css">
<LINK href="css/gallery.css" rel="stylesheet" type="text/css">
<LINK href="css/min_jquery.css" rel="stylesheet" type="text/css">
<LINK href="css/minified.css" rel="stylesheet" type="text/css">

</head>
    <body>

<!-- This is the form ---------->

<form id="form1" method="post" action="jquery_form.php">
      <div class="form-row"><span class="label">Name *</span><input type="text" name="name" /></div>
      <div class="form-row"><span class="label">E-Mail *</span><input type="text" name="email" /></div>
      <div class="form-row"><span class="label">URL</span><input type="text" name="url" /></div>
      <div class="form-row"><span class="label">Your comment *</span><textarea name="comment" ></textarea></div>
      <div class="form-row"><input class="submit" type="submit" value="Submit"></div>
    </form>

<!-- this is the jQuery validation ----------->

</div></div></body>

</html><script type="text/javascript">
    $(document).ready(function() {
      $("#form1").validate({
        rules: {
          name: "required",// simple rule, converted to {required:true}
          email: {// compound rule
          required: true,
          email: true
        },
        url: {
          url: true
        },
        comment: {
          required: true
        }
        },
        messages: {
          comment: "Please enter a comment."
        },
        errorPlacement: function (error, element) {
                    element.css('background', '#ffdddd');
                }
      });
    $("#form2").validate({
    rules:{
        name2:"required",
        pass: "required"
    }
})
    });
  </script>

有什么问题？我知道如果它不是第一个包含，则查询验证不起作用。但它是标题中的第一个包含。并且呈现的 HTML 看起来不错。该文件位于 js 文件夹中。

我在这上面花了几个小时。

此代码有效

这是另一个有效的 html 页面的渲染代码。如果验证失败，jQuery 将不会提交表单。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
  <head>
  <title>Simple Form Validation</title>
  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript" src="js/jquery.validate.js"></script>

  <style type="text/css">
    * { font-family: Verdana; font-size: 11px; line-height: 14px; }
    .submit { margin-left: 125px; margin-top: 10px;}
    .label { display: block; float: left; width: 120px; text-align: right; margin-right: 5px; }
    .form-row { padding: 5px 0; clear: both; width: 700px; }
    label.error { width: 250px; display: block; float: left; color: red; padding-left: 10px; }
    input[type=text], textarea { width: 250px; float: left; }
    textarea { height: 50px; }
  </style>
  </head>
  <body>
    <form id="form1" method="post" action="jquery.php">
      <div class="form-row"><span class="label">Name *</span><input type="text" name="name" /></div>
      <div class="form-row"><span class="label">E-Mail *</span><input type="text" name="email" /></div>
      <div class="form-row"><span class="label">URL</span><input type="text" name="url" /></div>
      <div class="form-row"><span class="label">Your comment *</span><textarea name="comment" ></textarea></div>
      <div class="form-row"><input class="submit" type="submit" value="Submit"></div>
    </form>
<p>
<hr>

  </body>
</html>
<script type="text/javascript">
    $(document).ready(function() {
      $("#form1").validate({
        rules: {
          name: "required",// simple rule, converted to {required:true}
          email: {// compound rule
          required: true,
          email: true
        },
        url: {
          url: true
        },
        comment: {
          required: true
        }
        },
        messages: {
          comment: "Please enter a comment."
        },
        errorPlacement: function (error, element) {
                    element.css('background', '#ffdddd');
                }
      });
    $("#form2").validate({
    rules:{
        name2:"required",
        pass: "required"
    }
})
    });
  </script>
4

2 回答 2

2

您已包含 jquery 两次，删除最后一个。

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>  
<script type="text/javascript" src="js/jquery.validate.js"></script> 
<!--  <script src="js/jquery.min.js" ></script>  --/>

此外，除了名称之外，您可能还想在表单字段上使用“id”属性。名称被传递给服务器，而 id 通常与 javascript 一起使用。

并将您的最后一个脚本移动到 body 标签或 head 标签内。

于 2012-04-08T20:02:36.787 回答
0

一个疯狂的猜测，但尝试<script>在结束</body>标记之前移动块。目前尚不清楚哪个包含的文件包含什么，但结束</body>标记之后不应出现任何内容。

于 2012-04-08T19:53:13.023 回答