1

当用户单击选择菜单时，我在 Javascript 中动态构建值，然后在选择元素上调用 jquery .html 函数。我可以在 Firefox 中看到动态选项，但在 Chrome 和 Safari 中，选择菜单什么也没有显示。仅当我关闭菜单并再次打开它时才会显示这些选项。有人有什么想法或建议吗？

var selectionDiv = $('#someSelectElement');
var newHtml = "";
for(var i = 0; i < 3; i++)
{
   newHtml += "<option>" + i + "</option>";
}
selectionDiv.html(newHtml);
4

2 回答 2

1

我想这取决于浏览器实现是否在单击处理程序完成之前或之后显示菜单。因此，您可以在浏览器之间获得（并且显然正在获得）不同的结果。

我猜有些浏览器更喜欢立即显示菜单，因此没有延迟，但代价是options没有机会发生任何修改。

最好的解决方案可能是根本不尝试修改click事件的内容。如果您需要此功能，也许您可​​以mouseover改用。

如果你使用mouseover那么你可以使用jQuery 的.one()方法，所以它只运行一次。

$('#someSelectElement').one('mouseover', function() {

    var newHtml = "";
    for(var i = 0; i < 3; i++)
    {
       newHtml += "<option>" + i + "</option>";
    }
    $(this).html(newHtml);

});
于 2010-11-11T18:53:00.173 回答
0

确保将您的代码包装在就绪事件中

$(function(){
  var selectionDiv = $('#someSelectElement');
  var newHtml = "";
  for(var i = 0; i < 3; i++)
  {
     newHtml += "<option>" + i + "</option>";
  }
  selectionDiv.html(newHtml);
});

你也可以试试这个：

$(function(){
  var selectionDiv = $('#someSelectElement');
  for(var i = 0; i < 3; i++)
  {
     selectionDiv.html(selectionDiv.html() + "<option>" + i + "</option>");
  }
});
于 2010-11-11T18:41:49.013 回答