Question

好的，所以我想在php / ajax中构建一个战斗脚本。目前我有一个用户移动的html表单和一个文本框（测试）我正在使用ajax将移动发送到一个解析文件，然后回显他们选择了哪个移动。我的问题是，我知道如何使它如此，当用户提交表单时，存储健康的变量下降，但我不知道如何在第一页上显示它。所以我有page1显示健康状况，用户选择攻击然后提交ajax会将移动发送到第2页并使健康状况下降但我不知道如何使健康状况下降到第1页没有当用户提交时我甚至不知道怎么让它动态显示。我希望我能尽力解释。

这是我到目前为止编码的内容。

我的ajax

<script language="JavaScript" type="text/javascript">
function ajax_post(){
    // Create our XMLHttpRequest object
    var hr = new XMLHttpRequest();
    // Create some variables we need to send to our PHP file
    var url = "my_parse_file.php";
    var sF = document.getElementById("selectionField").value;
    var ln = document.getElementById("last_name").value;
    var vars = "selectionField="+sF+"&lastname="+ln;
    hr.open("POST", url, true);


    // Set content type header information for sending url encoded variables in the request
    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    // Access the onreadystatechange event for the XMLHttpRequest object
    hr.onreadystatechange = function() {
   if(hr.readyState == 4 && hr.status == 200) {
   var return_data = hr.responseText;
document.getElementById("status").innerHTML = return_data;
   }
    }
    // Send the data to PHP now... and wait for response to update the status div
    hr.send(vars); // Actually execute the request
    document.getElementById("status").innerHTML = "processing...";
}



</script>
 <script type="text/javascript">
var x = <?php echo $phpx; ?>;
 var div = document.createElement("DIV");
 div.appendChild(document.createTextNode(x));
 document.body.appendChild(div);
 </script>

然后是div和html表单

 <select size="3" name="selectionField" id="selectionField" multiple="no" > 
    <option value="move1" >California -- CA </option>
    <option value="move2" >Colorado -- CO</option>
    <option value="move3" >Connecticut -- CN</option>
  </select>
  <br />
  <br />
  Your Last Name: 
  <input id="last_name" name="last_name" type="text" />
  <br />
  <br />
  <input name="myBtn" type="submit" value="Submit Data" onClick="javascript:ajax_post();">
  <br />
  <br />
</p>

</p>

<div id="status"></div>

所以，如果我在第1页的php中回应健康状况，那么用户会选择一个atatck然后它会被动态地发送到第2页第2页让hp下去/ php会话关闭。但因为我会在第一页上回显php中的变量，所以它不会动态变化。所以我猜我必须将变量存储在ajax端？

编辑这里是你们所遇到的一个例子。

       <script type="text/javascript">
    $.ajax({
      url: 'my_parse_file.php',
      type: 'POST',
      data: '{id: $('#nick').val() }'
      success: function(data){
       $('#hp').html(data);
      }
      }
    });
     </script>

<div id="hp"><?php echo $nick ; ?></div>

这是我在第一页添加的代码然后在my_parse_file.php旁边我有$ nick =＆＃39; 1＆＃39 ;; 但它没有显示任何东西......

Answer 1

你可以做类似的事情： Jquery checking success of ajax post

然后你真的不需要提交，只需用纯jquery更新当前页面。

修改

<script language="JavaScript" type="text/javascript">
    $(function() {
        $('#buttonAttack').click(function (){
        $.ajax({
                url: 'my_parse_file.php',
                type: 'POST',
                data: {id: $('#nick').val() }
                success: function(data){
                    $('#hp').html(data);
                }
             });
    });
    });
</script>
<div id="hp"></div>
<input id='buttonAttack' type='button' value='Attack!' />

Answer 2

步骤1）将脚本切换到jquery ajax（建议用于理智）

反过来会导致

$.ajax({
  url: 'your_php_page.php',
  type: 'POST',
  data: '{id: $('#last_name').val() }'
  success: function(data){
   $('#status').html(data);
  }
  }
});

URL：是你的php的链接 data：是php将看到的所有变量$ _POST

your_php_page.php执行你的fetch / model并回显结果。完成后，“data”是返回的echo，您将用您想要的任何html替换#status id。

编辑：要回答你添加的代码 - 你混淆了你的php和javascript错误

with $（'＃hp'）。html（data）你已经回复了从php文件收到的数据。这就是为什么javascript是客户端而php是服务器端。

没有刷新的Ajax动态变量

2 个答案: