使用AJAX填充页面

Question

这对我来说是一个全新的领域，所以我希望有人可以指出我正确的方向，希望是一个很好的教程？

我有一个带有下拉列表的页面，基于我需要填充页面的列表中的用户选择。

有人能指出我做一个类似的好教程的方向吗？

这是我需要做的事情的顺序：

1. 页面加载
2. 用户从HTML下拉列表中选择一个值
3. 另一个PHP页面返回与该选择相关的数组。

任何人都可以帮助我吗？

Answer 1

使用jQuery：

$('#id-of-your-select').change(function() {

  $.ajax({

    method: 'post',
    url: 'yourscript.php',
    data: '?theValue=of&your=dropdown',
    success: function(data) {
      $('#div-to-be-populated').html(data);
    }
  });
 });

并在你的php中：

<?php

switch($_GET['dropdownvalue'] {

  case 'hello':
    echo '<p>Hello World<p>';
  break;
}
?>

当然你必须根据自己的需要进行配置，但我希望你能得到基本的想法

Answer 2

检查一下，http://www.w3schools.com/php/php_ajax_php.asp

本教程将使您成为AJAX和PHP的专家。

Answer 3

根据您的要求，您需要两个PHP页面和AJAX知识。

1. PHP Page1（可能是HTML）加载普通页面
2. 在浏览器上，您需要捕获'onChange'事件以便下拉以调用函数。
3. 在该功能下，向您的第二个PHP页面发出AJAX请求。
4. 需要使用PHP返回的数据。

这是应该发生的事情的简单列表。

我认为你对第1步没问题。

对于第2步，您需要学习基本的javascript。只是谷歌如何捕获onChange事件。几个快速链接是： display selected item from dropdown onchange function into html label through javascript , please help how to it

对于第3步，我建议不要选择快捷方式，而是通过完整的AJAX教程 http://www.w3schools.com/ajax/default.asp

完成该教程后，您将自己做事。

Answer 4

您可以使用jquery以非常简单的方式完成此操作。 jquery是解决此类问题的最佳解决方案。重要的链接是：http://jquery.com 而且你也可以向w3schools学习更好的jquery知识。