使用 JQuery 从数组中填充下拉列表答案

【问题标题】：Populate drop down list from array using JQuery使用 JQuery 从数组中填充下拉列表
【发布时间】：2011-03-30 07:42:05
【问题描述】：

假设我有这个数组：

Array(
      [0] => Array(
                  [Brand] => 'Toyota',
                  [Model] => 'Camry',
                  [Color] => 'Red',
                  [Year] => 2002
      )
      [1] => Array(
                  [brand] => 'Nissan',
                  [Model] => 'Skyline',
                  [Color] => 'White',
                  [Year] => 2005
      )
      [2] => Array(
                  [Brand] => 'Honda',
                  [Model] => 'Civic',
                  [Color] => 'Green',
                  [Year] => 2000
      ) )

然后在下拉列表中我有“键”品牌 + 型号 + 颜色 + 年份

问题：如何使用 JQuery(AJAX) 填充另一个下拉列表，并在单击一个键时使用“值”？

示例：当我点击 Model 时，我想用 Camry + Skyline + 值填充另一个下拉列表思域，如果我点击Color，会显示为Red + White + Green等等

干杯！

【问题讨论】：

标签： php ajax arrays populate

【解决方案1】：

如果您的数组是cars[]，并且您的选择框的 ID 分别为“sourceBox”和“targetBox”，则以下代码将在#sourceBox 中获取所选项目的文本，并使用来自的所有等效值填充#targetBox你的阵列。因此，在#sourceBox 中选择“color”将用“red”、“white”和“green”填充#targetBox。

    $(document).ready(function(){
       $('#sourceBox').change(function(){
        var options = "";
        for (var i = 0; i < cars.length; i++){
          options += '<option>' 
              + cars[i][$('#sourceBox option:selected').text()] 
              + '</option>';
        }
        $('#targetBox').html(options);
        });
    });

【讨论】：

我忘了说这个数组是用 PHP 编写的，而不是 Java Script。如何将 PHP 中的一个数组解析为 Java Script 中的一个数组？
@Derick 检查我的答案。您可以轻松地将 PHP 数组解析为 JS。只需在标签中使用标签。

【解决方案2】：

只是一段非常通用的代码。您应该更具体（显示您希望从该 PHP 数组创建的 HTML）。无论如何，它去。这只会使用您的 PHP 数组中的值创建 JS 数组。应该很容易与那些一起工作：

<?php

$brands = array();
$models = array();
$colors = array();
$years = array();
foreach ($arr as $k=>$v) {
    switch ($k) {
        case 'Brand':
            $brands[] = $v;
            break;
        case 'Model':
            $models[] = $v;
            break;
        case 'Color':
            $colors[] = $v;
            break;
        case 'Years':
            $years[] = $v;
            break;
    }
}

?>

<script type="text/javascript">
    //<!--
$(document).ready(function() {

    var brands = new Array(<?php echo count($brands); ?>);
    var models = new Array(<?php echo count($models); ?>);
    var colors = new Array(<?php echo count($colors); ?>);
    var years = new Array(<?php echo count($years); ?>);

<?php

$i = 0;
foreach ($brands as $v) {
    echo 'brands[' . $i. '] = ' . $v . ';'
    ++$i;
}
$i = 0;
foreach ($models as $v) {
    echo 'models[' . $i. '] = ' . $v . ';'
    ++$i;
}
$i = 0;
foreach ($colors as $v) {
    echo 'colors[' . $i. '] = ' . $v . ';'
    ++$i;
}$i = 0;
foreach ($years as $v) {
    echo 'brands[' . $i. '] = ' . $v . ';'
    ++$i;
}

?>

    // now you should have items from your PHP array in JS arrays so you can do something with them

    $('a.populate-brands').click(function() {
        for (v in brands) {
            //
        } 
    })

});    //-->
</script>

【讨论】：

哦，好的。非常感谢！这很有帮助。干杯！