Question

你好，我回到我的项目的另一个问题。我因某种原因一直卡住了！我今天才开始使用AJAX，所以我希望你能原谅我的无知！好吧首先我有一个类型按钮，当我点击它我希望它返回一个数字（这是客户想要购买的特定项目的数量）和项目的名称。从下拉列表中选择数字，书的名称来自输入类型=“隐藏”。从下拉列表中获取数字到php我想使用AJAX，我已将其设置为我的html页面标题中的方法。我尝试使用ajax将项目的编号返回到同一个php页面时，此方法的代码如下所示。这是方法。

   function ajax_post(myform)
   {
      var hr = new XMLHttpRequest();
      var url = "islandshop.php";
      var index =  myform.quantity1.selectedIndex;

      var value = document.getElementById("quantity1").options[index].value;
      var variable = "value="+value;

       hr.open("post", url, true);
       hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

       hr.onreadystatechange = function() {
       if(hr.readyState == 4 && hr.status == 200) {
       var return_data = hr.responseText;
       document.getElementById("status").innerHTML = return_data;
      }

     }

      hr.send(variable); 
      document.getElementById("status").innerHTML = "processing data";


}

接下来就是当我按下按钮的时候，我只需要从下拉列表中的数字返回给我的PHP。但当我按下按钮这是我的添加到购物车按钮时，它返回整个页面“islandshop.php”给我。但是页面末尾的值至少并不是坏的，它会返回值。这是我的表单，我用我的按钮调用ajax_post（）方法。

                             <form method="post" action="" name="form1">
                                <span style="color:#000">  <label                           for="quantity">Quantity:</label></span>
                                <select name="quantity1" id="quantity1" onchange="">
                                    <option value="1" selected>1</option><option value="2">2</option>
                                    <option value="3">3</option>
                                    <option value="4">4</option><option value="5">5</option>
                                    <option value="6">6</option>
                                    <option value="7">7</option><option value="8">8</option>
                                    <option value="9">9</option>
                                    <option value="10">10</option><option value="11">11</option>
                                    <option value="12">12</option>
                                    <option value="13">13</option><option value="14">14</option>
                                    <option value="15">15</option>
                                    <option value="16">16</option><option value="17">17</option>
                                    <option value="18">18</option>
                                    <option value="19">19</option><option value="20">20</option>
                                    <option value="21">21</option>
                                    <option value="22">22</option><option value="23">23</option>
                                    <option value="24">24</option>
                                    <option value="25">25</option><option value="26">26</option>
                                    <option value="27">27</option>
                                    <option value="28">28</option><option value="29">29</option>
                                    <option value="30">30</option>
                                </select>
                                 <input type="hidden" name="book1" value="cape clear island: its peopleand landscape" />
                                <input type="button" value="Add To Cart" name="submit1" onclick="javascript:ajax_post(this.form)"></button>

                                 </form>

对我来说似乎很好。最后一部分只是在islandshop.php页面末尾的php标签，我尝试打印该值并获得整个页面的副本。所以基本上我在浏览器中显示了两次我的页面。但是使用页面第二个版本中的值。

<?php

 if(isset($_SESSION['username']))
 {
 echo 'Thank you you selected '. $_POST['value'];
 } 

 ?>

我想我知道为什么我按下按钮时整个页面回来了，因为我有hr.open（）url作为这个页面“islandshop.php。我读了一些关于这个的东西，它说了一些关于发送值的东西到浏览器，然后浏览器将变量发送回.php页面，该页面会将它们重定向到原始页面，但它没有得到很好的解释。所以我的主要目标是从下拉列表中获取值从服务器以PHP形式，所以我可以使用该值来做这个页面上的东西！再次感谢帮助，希望我不会发布这么多问题后，我想出这个。即使有人可以指导我一本好书或关于AJAX的文章我很高兴！干杯

Answer 1

如果您要回发到同一页面，那么您可以进行条件检查以查看是否设置了$_POST['value']。如果是，则执行回显，否则显示html。

<?php 
if( isset($_SESSION['username']) && isset( $_POST['value'] ) )
{
    echo 'Thank you you selected '. $_POST['value']; 
}
else 
{
?> 
  <form method="post" action="" name="form1">
      <span style="color:#000">  
       <label for="quantity">Quantity:</label></span>
                            <select name="quantity1" id="quantity1" onchange="">
                                <option value="1" selected>1</option><option value="2">2</option>
                                <option value="3">3</option>
                                <option value="4">4</option><option value="5">5</option>
                                <option value="6">6</option>
                                <option value="7">7</option><option value="8">8</option>
                                <option value="9">9</option>
                                <option value="10">10</option><option value="11">11</option>
                                <option value="12">12</option>
                                <option value="13">13</option><option value="14">14</option>
                                <option value="15">15</option>
                                <option value="16">16</option><option value="17">17</option>
                                <option value="18">18</option>
                                <option value="19">19</option><option value="20">20</option>
                                <option value="21">21</option>
                                <option value="22">22</option><option value="23">23</option>
                                <option value="24">24</option>
                                <option value="25">25</option><option value="26">26</option>
                                <option value="27">27</option>
                                <option value="28">28</option><option value="29">29</option>
                                <option value="30">30</option>
                            </select>
                             <input type="hidden" name="book1" value="cape clear island: its peopleand landscape" />
                            <input type="button" value="Add To Cart" name="submit1" onclick="javascript:ajax_post(this.form)"></button>

                             </form>
<?php } ?>

Answer 2

我强烈建议您查看jQuery：http://jquery.com/

使用AJAX将javascript中的值返回到同一页面上的php

2 个答案: