php – 使用jQuery提交表单

发布时间:2022-04-30 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了php – 使用jQuery提交表单脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
如果之前已经回答过这些道歉(我在搜索档案时找不到答案)

我有一个受密码保护的页面

<?PHP

if($_POST['pw'] == 'pw')
{
    //Page content
} else
{
    //Display password form
}
?>

页面内容中,我有一个表单,我想使用jQuery提交,并具有以下代码

<script type='text/javascript'>

  var dataString = $('input#input1').val();  

  $(function() {  

  $('#submit').click(function()
  {  
    $.ajax({  
      type: 'POST',url: 'p2.PHP',data: dataString,dataType: html,success: function(data2) {
        $('#testResult').html(data2);
      }  
    });  
    return false; 
  });
});

</script>

<form name='form1' id='form1' action=''>  
  <fieldset>  
    <label for='input1' id='input1_label'>Input 1</label>  
    <input type='text' name='input1' id='input1' size='30' />  

    <input type='submit' value='Update / reset' id='submit' class='buttons' />
   </fieldset>  
</form> 

<div id='#testResult'></div>;

但是,单击submit然后将表单发送到p1.PHP?input1 = test(即,数据字符串正在发送到p1.PHP,而不是p2.PHP).如果我编辑代码删除dataType:html和data2的2个引用,那么这不会发生(事实上,没有任何反应,所以我假设jQuery正在将数据提交到表单).我还将类型更改为’GET’,因为同一页面上的2个POST请求导致了问题,但这并没有改变结果.

从p2.PHP(即data2)获取信息并显示它我错过了什么?!

编辑

感谢评论指出一个拼写错误,我已经将dataType:html更改为dataType:’html’ – 这现在不会导致页面重定向到p1.PHP?input1 = test,但是再一次,它没有做任何事情(当它应该仍然返回data2的值时)

编辑2

我已经更新了代码,所以dataString现在是:

var dataString = $('input#input1').val();   
dataString = 'var1='+dataString;

但这没有任何区别

为了澄清,我的p2.PHP只包含以下内容

<?PHP

  echo "<p>HELLO!</p>";

?>

编辑3

我对Damien建议的代码进行了修改;我得到“工作!”的警报但是仍然没有从p2.PHP返回任何内容,并且没有任何内容插入到#testResult div中.

解决方法

$(function() {  
  $('#submit').click(function()
  {  
    var dataString = $('#form1').serialize();
    $.ajax({  
      type: 'POST',success: function(data2) {
        alert('works!');  // ADDED AFTER UPDATE
        $('#testResult').html(data2);
      },/* ADDED AFTER UPDATE */
      error:function(obj,status,error)
      {
         alert(error);
      }
    });  
    return false; 
  });
});

编辑:
在p2.PHP中:

<?PHP
var_dump($_POST['pw']);
?>

在p2.PHP中,您需要输出(例如,使用echo)您希望在ajax成功调用中作为“data2”返回的内容.

更新:

由于您的Ajax请求成功触发,这意味着您的帖子未正确传递,或者您没有输出任何内容.我重新看了你的代码,我看到了这个:

<input type='text' name='input1' id='input1' size='30' />

这意味着你正在获取错误的$_POST变量!

做这个:

>因为您要发送名称=“input1”,所以在p2.PHP中尝试:

<?PHP
if(isset($_POST['input1'])
{
 echo $_POST['input1'];
}
else
{
 echo 'No post variable!';
}

在你的jquery成功:

success: function(data2) {
       alert(data2);  
       $('#testResult').html(data2);
     },

>如果按照字面意思执行,那该工作就可以了.在遥远的可能性它将无法工作,忘记AJAX,删除JavaScript并做一个正常的帖子提交与p2.PHP作为你的形式的行动:)

脚本宝典总结

以上是脚本宝典为你收集整理的php – 使用jQuery提交表单全部内容,希望文章能够帮你解决php – 使用jQuery提交表单所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签:jquery