1

谁能告诉我为什么这不起作用或给我另一种方法来做我想做的事。

单击提交时，我在页面上有一个表单，我希望它处理成 add.php 并在一个名为 right 的 DIV 中打开。

表单页面

<script>
$("#Submit").click(function() {

var url = "add.php"; // the script where you handle the form input.

$.ajax({
       type: "POST",
       url: url,
       data: $("#myForm").serialize(), // serializes the form's elements.
       success: function(html){ $("#right").html(html); }
     });

return false; // avoid to execute the actual submit of the form.
});
</script>
</head>
<body>
<form action="add.php" method="post" enctype="multipart/form-data" id ="myForm">
 Name: <input type="text" name="name"><br> 
 E-mail: <input type="text" name = "email"><br> 
 Phone: <input type="text" name = "phone"><br> 
Photo: <input type="file" name="photo"><br>
<input type="submit" value="Upload">

</form>

</body>

现在，如果我向表单添加操作以将其定向到 add.php 一切正常，所以其他脚本还可以，但是当我这样做时，没有任何反应，它不会像我想要的那样将 add.php 加载到“正确”的 div 中.

有人有什么建议吗？

4

3 回答 3

0

这是您的确切代码吗？有几个问题：

  • $("#Submit").click应该包装在一个文档就绪处理程序中，这样它就不会在页面实际加载之前运行。
  • 没有与#Submit 匹配的按钮
  • 没有与#right 匹配的 div

尝试 

<script type="text/javascript">

jQuery(document).ready(function($) {

$("#Submit").click(function() {

var url = "add.php"; // the script where you handle the form input.

$.ajax({
       type: "POST",
       url: url,
       data: $("#myForm").serialize(), // serializes the form's elements.
       success: function(html){ $("#right").html(html); }
     });

return false; // avoid to execute the actual submit of the form.
});
});
</script>
</head>
<body>
<div id="right">
</div>

<form action="add.php" method="post" enctype="multipart/form-data" id ="myForm">
 Name: <input type="text" name="name"><br>
 E-mail: <input type="text" name = "email"><br>
 Phone: <input type="text" name = "phone"><br>
Photo: <input type="file" name="photo"><br>
<input type="submit" value="Upload" id="Submit">

</form>

于 2012-10-05T10:54:05.937 回答
0

你必须在body标签中的div上创建哪个id是正确的并且

<input id="submit" type="submit" name="upload" >

像这样在body标签中添加新的div

<div id="right"></div>
于 2012-10-05T10:58:06.947 回答
0

您的 $("#Submit") 选择器不匹配任何内容（提交按钮没有 id 并且在绑定尝试之后定义），因此该函数未绑定到任何事件，因此从未执行。

取而代之的是，表单按其应有的方式运行：提交后，将其内容发布到“action”属性中指定的 url。这就是发生的事情，那个 div 永远不会被触及。

您必须回过头来了解 jquery 选择器是如何工作的。如何将函数绑定到事件。

于 2012-10-05T10:51:44.387 回答