Javascript 动态填充html页面上的选择菜单，在不使用jquery mobile的情况下显示在android webview上

我使用google apps脚本制作了一个web应用程序，并将其部署到web上。该应用程序在PC上运行良好，但当我将其加载到android上的webview时，动态填充的菜单不会显示，它们是空的

我知道google caja在jquery mobile上有问题，所以我不能使用jquery mobile

问题是，是否有一种方法可以使菜单只使用jquery或javascript工作？或者我可以在安卓系统上玩些把戏

下面是我如何使用jquery填充菜单的示例：

function addClients(clients){   //array of options from google spreadsheets.
  $('#client').empty();
  for (var i in clients) {
    $('#client').append('<option>'+clients[i]+'</option>');
    $('#client').trigger("chosen:updated");
  }
}

先谢谢你

编辑： 看来菜单不新鲜。开始时，我有一个内置选项：

<option> ---- Choose a client ----</option>

---

简短回答：是的，这是绝对可能的。jQuery所做的几乎所有事情都在后台使用本机HTML/CSS/JavaScript功能。作为一个框架，它的存在只是为了使您的编码更快、更容易

如果选择has id client，则可以使用var selectClient=document.getElementByIdclient；来选择它

我不知道从哪里可以获得手动输入的选项，或者通过PHP API调用加载的选项，或者从数据库中获取的选项，所以我假设您可以访问要添加的选项

向客户端添加选项可以通过使用

selectClient.innerHTML += "<option>My option here</option>";

innerHTML属性基本上保存到之间的所有内容

如果要在添加新选项之前删除现有选项，只需先将innerHTML设置为空字符串。 如果要编辑特定的选项标记，则需要使用任何本机或jQuery方法来查找标记或ID（如果向选项添加ID以选择该选项）

希望这有帮助

另外，这个解决方案是纯JavaScript的，但是如果平台支持的话，您当然可以使用任何等价的jQuery函数。innerHTML属性的jQuery等价物是html，如$client.htmlFoo条中所示

---

编辑04-08-2014：由于OP没有使用他为jQuery调用的事件所选择的插件，但是上面描述的步骤仍然正确，如果没有使用所选择的，仍然适用。

我解决了这个问题。我所做的是在清空选择菜单并出于我的目的使用jquery ui的行中添加注释：

function addClients(clients){   //array of options from google spreadsheets.
  //$('#client').empty(); ---------- I commented this.
  for (var i in clients) {
    $('#client').append('<option>'+clients[i]+'</option>');
   // $('#client').trigger("chosen:updated"); ------- This line is also removed
  }
$(function() {  // And added jquery ui select menu
  $( "#client" ).selectmenu();
  });
}

---

这就成功了。我不知道为什么…

它不起作用。我更改的内容：“function addClientsclients{$'client.empty；var clientOptions=document.getElementByIdclient；对于客户端{clientOptions.innerHTML++=+clients[I]+；}}}中的var I，但在android中，我仍然会看到空的弹出菜单。您没有提到您正在使用所选的jQuery插件。当您在select上调用select或类似方法时，select会使用其自身的功能初始化select。我猜问题在于你做这件事的顺序。在选择“编辑”之前，请尝试执行“选择”的所有操作。@keshet另外，请尝试在正常的web环境中执行相同的代码，例如制作JS小提琴。如果你的代码在那里工作，那么这个问题是Android特定的，在这种情况下，你通常必须仔细考虑一些方法来尝试并逐个检查它们。我建议将您尝试的内容记录在一个小列表中，这样您就不会失去监督，并且可以快速查看是否还有未尝试的内容。正如我提到的，在正常的web环境中，在PC上，此web应用程序工作正常。这个问题在安卓系统方面存在。我尝试刷新select，不仅使用select，而且结果没有改变。此外，如果我在android上使用网络浏览器打开此web应用程序，一切正常。谢谢你的帮助。我感觉Selected和Google Caja之间的交互不太顺利，因为Caja是一个对第三方插件施加某些限制的安全模块。我认为这两个人之间的交流不起作用。尝试删除所选内容，首先只使用本机JS或jQuery中的JS。如果这不起作用，你也可以把它作为一个问题报告给谷歌，但我怀疑这个问题在没有选择的情况下不会成为一个问题。

$('#client').trigger("chosen:updated");

$('select').selectmenu('refresh');

$('#client').hide();
$('#client').show();

$('select#client').selectmenu('refresh');

selectClient.innerHTML += "<option>My option here</option>";

function addClients(clients){   //array of options from google spreadsheets.
  //$('#client').empty(); ---------- I commented this.
  for (var i in clients) {
    $('#client').append('<option>'+clients[i]+'</option>');
   // $('#client').trigger("chosen:updated"); ------- This line is also removed
  }
$(function() {  // And added jquery ui select menu
  $( "#client" ).selectmenu();
  });
}