使用内联JavaScript更新下拉列表

Question

我有一个实现如下的下拉列表：

   <select name="myDDownList" class="none" id="myDDownListID" style="height:25px; width:   280px">

   <?php
   if(file_exists($filesDir))
   {
     foreach (new DirectoryIterator($filesDir) as $file)
     {
       if((htmlentities($file) !== ".") && (htmlentities($file) !== ".."))
       {
         echo "<option>" .htmlentities($file). "</option>";
       }
     }
   ?>
   </select>

文件夹$ filesDir的内容可以由操作系统自动更新，我也希望自动更新下拉列表的内容，而无需手动重新加载整个页面内容。

我虽然可以使用setInterval函数使用内联Javascript代码，但可以通过以下方式更改代码：

  <select name="myDDownList" class="none" id="myDDownListID" style="height:25px; width: 280px">

  <?php
  if(file_exists($filesDir))
  {
    foreach (new DirectoryIterator($filesDir) as $file)
    {
      if((htmlentities($file) !== ".") && (htmlentities($file) !== ".."))
      {
        echo "<option>" .htmlentities($file). "</option>";
      }
    }
  }
  ?>

  <script>
     /* use 'setInterval' function here */
  </script>
  </select>

但老实说，我不知道如何更新setInterval函数内的下拉列表的内容。 我想我必须使用Javascript库中的函数。 但是我不知道哪个功能。

拜托，您能帮我找出解决方案吗？ 预先感谢您的帮助。

西蒙

Answer 1

您将创建一个php页面“ getListDirectory.php”

 <?php
  if(file_exists($filesDir))
  {
    foreach (new DirectoryIterator($filesDir) as $file)
    {
      if((htmlentities($file) !== ".") && (htmlentities($file) !== ".."))
      {
        echo "<option>" .htmlentities($file). "</option>";
      }
    }
  }
  ?>

并且您的脚本只需每15秒请求一次距离：

setInterval(function(){

$.get( "getListDirecotry.php", function( data ) {
  $("#myDDownListID").html(data);
});

}, 15000);