提交位于同一页面上的表单而不刷新页面

时间:2012-07-31 03:22:05

标签: php javascript html jquery

所以这里是一场令人困惑的战斗。我想提交一份同一页面上的表格 作为我的PHP验证。

HTML

 <form id="form">
  //fields
  <input type="submit" id="submit">
  </form>

<?php
/ /check if form is good
?>

jquery的

$("#actvpost").submit(function(){
    //code
  return false;
});

当我点击提交页面仍然刷新我怎么能只有没有发送数据 使用外部页面

我可以在没有jquery的情况下完成它,但它会刷新页面,我想附加jquery,以便它不刷新页面。

3 个答案:

答案 0 :(得分:5)

您的表单的ID应该是actvpost而不是form,因为您在jQuery选择器中引用了actvpost

您的提交功能不应该return false,而应该使用event.preventDefault

$("#actvpost").submit(function( event ){
    event.preventDefault();
    // your code
});

event对象

所有事件都以event对象作为第一个参数传递给触发器。此对象包含许多有关事件的有用属性,例如event.targetevent.type(返回click,keyup等等)。 jQuery还使用诸如preventDefault()

之类的有用方法扩展了这个对象

虽然没有必要,但我建议尽早将event.preventDefault()放在你的处理程序中。这也不是必要的,但如果您打算在将来编写更复杂的代码,这是一个很好的做法。组织是关键,一切都应该遵循某种共同的惯例。使用任何约定进行编码时更容易解决问题,更不用说常见的约定了。

基本上,如果没有新的HTTP请求,您就无法运行PHP,因此,您可能希望在提交之前单独使用javascript验证,并将服务器端验证作为最后一道防线。要将表单提交到PHP脚本,您需要:

  • 使用AJAX(jQuery使这很简单)
  • 提交给iframe,同时在Javascript
  • 中收听其“加载”事件以获取响应

两者都发出新的HTTP请求,并在javascript中提供响应。

答案 1 :(得分:1)

也许:

$("#actvpost").submit(function (event) {
  event.preventDefault();
  // here you may by your self send request and get response
});

也许你会使用类似jQuery Form Plugin的东西并使用ajaxForm函数。

答案 2 :(得分:0)

替换:

<form id="form">

使用:

<form id="actvpost">