Question

这是我选择ID的HTML代码：

<select class="dropdown-toggle" id="combo"></select>

我有这个HTML文件，我需要使用名为xml的根文件夹中的XML文件填充选项。我在标题中导入了JQuery。我尝试了很多例子，但我无法让它发挥作用。 XML文件位于/ XML文件夹中。

提前致谢！

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
<script type="text/javascript">
  $(function(){
  $.ajax({
  url: '/xml',
  success: function(d){
    $.each(d.split(/[\r\n]+/),function(i,e){


      $('<option>',{ value: e }).text(e),'</option>'.appendTo('#combo');
       });
      }
  });
</script>

我尝试了这段代码，但它无效......

Answer 1

简短回答：你必须使用一些服务器端代码来生成列表。

以下是PHP中的一个示例：

header('Content-type: application/json');

$folder = opendir('path/to/xml');
$list = array();

while ( $file_name = readdir( $folder ) ) {
    // Only get the XML files
    if ( pathinfo($file_name, PATHINFO_EXTENSION) !== 'xml' ) continue;

    $list[] = pathinfo($file_name, PATHINFO_FILENAME);
}

closedir( $folder );

echo json_encode( $list );

或者，正如@charlietfl在上面的评论中指出的那样，你可以使用glob：

header('Content-type: application/json');

$list = array();

foreach(glob('path/to/xml/*.xml') as $file_name) {  
    $list[] = pathinfo($file_name, PATHINFO_FILENAME);
}

echo json_encode( $list );

在服务器上设置了该脚本之后，您可以在JavaScript中循环遍历该阵列：

$.ajax({
    url: 'path/to/list_xml_files.php',
    success: function (data) {

        var $select = $('#combo');

        $.each(data, function(i, v) {
            $('<option>', {
                value: v,
                text: v
            }).appendTo( $select );
        });
    }
});

您可以通过立即完成所有append来进一步优化此功能，但这是另一天的讨论......

使用xml文件填充选择选项文件夹

1 个答案: