使用依赖于PHP数组的选项进行选择

Select with options dependent of PHP Array

本文关键字：选项 行选 选择 数组 依赖于 PHP      更新时间：2023-09-26

我有列表选择：

<select id="sel">
  <option id="a1" value="volvo">Volvo</option>
  <option id="a2" value="saab">Saab</option>
  <option id="a3" value="mercedes">Mercedes</option>
  <option id="a4" value="audi">Audi</option>
  <option id="a5" value="volvo2">Volvo2</option>
  <option id="a6" value="saab2">Saab2</option>
  <option id="a7" value="mercedes2">Mercedes2</option>
  <option id="a8" value="audi2">Audi2</option>
</select>

在PHP中，我有一个数组：

$array = array('a1', 'a4', 'a5', 'a8');

如何使用jQuery显示在PHP的$array中id选项为isset的select#sel only值中？

例如：

<select id="sel">
  <option id="a1" value="volvo">Volvo</option>
  <option id="a4" value="audi">Audi</option>
  <option id="a5" value="volvo2">Volvo2</option>
  <option id="a8" value="audi2">Audi2</option>
</select>

http://jsfiddle.net/TZCcA/

我不想为此使用PHP。我想使用jQuery。谢谢

使用php数组，您可以生成这样的选择器，并删除或隐藏不需要的选项。

您可以从服务器端呈现数组或选择器（'#a1, #a4, #a5, #a8'）本身，并在客户端使用它。

$('select option').not('#a1, #a4, #a5, #a8').remove();

如果它是一个数组，你可以试试这个。

$('select option').not('#' + array.join(',#')).remove();

工作演示-http://jsfiddle.net/TZCcA/1/

您可以这样做，但您需要将PHP数组回显到页面，以便jQuery可以使用它。

jQuery:

var ary = ['a1', 'a4', 'a5', 'a8']; // output your PHP array here
$('option').each(function() {
    if ($.inArray($(this).attr('id'), ary)==-1) $(this).remove();
})

并且您希望在jQuery数组定义中回显您的PHP数组。类似这样的东西：

var ary = [
<?php
foreach($item in $array){
    echo "'$item',";
}
?>
];

请注意，这将在末尾添加一个您不需要的额外逗号。用循环删除它是微不足道的，但我没有将其添加到这段代码中。

jsFiddle示例（没有PHP）。

您首先需要将数组转换为可用的格式，以便jQuery可以访问其值。我建议使用json_encode。

echo json_encode( array('a1', 'a4', 'a5', 'a8') );

输出为：

["a1","a4","a5","a8"]

因此，最好将其分配给一个变量。然后，您将循环浏览您的列表，并隐藏阵列中未找到的任何元素：

// Our array from PHP
var myArr = ["a1","a4","a5","a8"];
// Select all options, and filter
$("#sel option").filter(function(){
  // Return items not found in our array
  return $.inArray( this.id, myArr ) === -1;
}).remove();

正在演示：http://jsbin.com/ocebup/edit#javascript，html

ShankarSongoli也有一个很好的解决方案，它不需要过滤器，而是将值数组修改为选择器，并将其传递到$.not（）方法中。查看他们对代码的回答：https://stackoverflow.com/a/9723034/54680

相关文章：