如何使用ajax从html获取数据并将其传递给php答案

【问题标题】：How to get and pass data from html to php using ajax如何使用ajax从html获取数据并将其传递给php
【发布时间】：2013-02-22 05:20:30
【问题描述】：

您好，我很想知道如何将表单中的字符串传递给 php，该 php 将测试其中是否有内容，然后使用此表单发布警报消息以尝试从中获取数据，然后显示是否它被正确传递了。

HTML 代码：

<form action='' method=''>
Name:<input type='text' name='name' id='name'>
Age:<input type='text' name='age' id='age'>
message:<textarea name='message' id='message'></textarea>
<input type='submit' value='Send'>
</form>

输出：

<?php
if(isset($_POST['name']) && isset($_POST['age']) && isset($_POST['message'])){

$a = $_POST['name'];
$b = $_POST['age'];
$c = $_POST['message'];

   if($a != NULL && $b != NULL && $c != NULL)
       {
         echo "
                <script type='text/javascript'>
                window.alert('Success'+ a + b + c)
                </script>
              ";
        }


};?>

虽然仍然在与之前相同的页面中，但会显示我在警告框中输入的内容。

如果它附带有关如何将它与 get 和 post 功能一起使用的说明，如果可以的话，我也将不胜感激？

【问题讨论】：

标签： php javascript html ajax post

【解决方案1】：

您可以轻松地对代码进行以下更改：

HTML：

<form action='' method='' id="myform">
Name:<input type='text' name='name' id='name'>
Age:<input type='text' name='age' id='age'>
message:<textarea name='message' id='message'></textarea>
<input type='submit' value='Send'>
</form>

PHP：

(your_page_with_php_script)

<?php
if(isset($_POST['name']) && isset($_POST['age']) && isset($_POST['message'])){

$a = $_POST['name'];
$b = $_POST['age'];
$c = $_POST['message'];

   if($a != NULL && $b != NULL && $c != NULL)
   {
      echo "Success ".a." ".b." ".c;
   }


};
?>

脚本：（首先包含 jquery）

$('#myform').submit(function(){

var name = $('#name').val();
var age = $('#age').val();
var message = $('#message').val();


$.ajax({
  type: "POST",
  url: "your_page_with_php_script.php",
  data: "name="+name+"&age="+age+"&message="+message,
}).done(function( msg ) {
  alert( "Data Saved: " + msg );
});

});

【讨论】：

@user1868185 很高兴它有帮助:)

【解决方案2】：

根据需要编辑以下内容：

$.ajax({
  type: 'POST',
  url: 'your_php_page.php',
  data: { postVar1: 'theValue1', postVar2: 'theValue2' },
  beforeSend:function(){
    // this is where we append a loading image
    $('#ajax-panel').html('<div class="loading"><img src="/images/loading.gif" alt="Loading..." /></div>');
  },
  success:function(data){
    // successful request; do something with the data
    $('#ajax-panel').empty();
    $(data).find('item').each(function(i){
      $('#ajax-panel').append('<h4>' + $(this).find('title').text() + '</h4><p>' + $(this).find('link').text() + '</p>');
    });
  },
  error:function(){
    // failed request; give feedback to user
    $('#ajax-panel').html('<p class="error"><strong>Oops!</strong> Try that again in a few moments.</p>');
  }
});

请求页面应该有一个 id="ajax-panel" 的 div

【讨论】：

【解决方案3】：

您必须将 Jquery 与 Ajax 一起使用...

<script>
$("#submit").click(function()
    {
       var name = $('#name').value();
       var age= $('#age').value();
       var message= $('#message').value();

        $.ajax({ 
            url: "urpage.php",
            data: {name : name, age : age, message : message},
            type: "POST",               
            success: function(output) {

               alert(output); //This will show ur output in an alert box
                   }                }
        })

    });
</script>

希望这可行

【讨论】：