1

我有以下html:

<div class="sk-toolbar-tools-primary">
   <span class="sk-custom-select">
      <select name="music-sort-select" id="music-sort-select">
          <option value="option1">Company 1</option>
          <option value="option2">Company 2</option>
          <option value="option3">Company 3</option>
     </select>
  </span>
</div>

如您所见,此选择元素使用 CSS 样式设置样式,现在如果我使用 AJAX 调用从数据库中发布公司并使用此 Javascript 函数将响应注入到选择中:

 function loadCompanies(){
    var companies= getCompanies();
    var select = document.getElementById("music-sort-select");
    for(var i = 0; i<companies.length; i++) {
        select.options[select.options.length] = new Option(companies[i].name,companies[i].id);
    }

}

在哪里getCompanies()进行 AJAX 调用,发生的情况是 Javascript 函数工作正常,我可以看到使用 chrome 中的开发人员工具发布的 DB 中的数据,但是选择停止工作并且它没有打开并显示选项。我猜这是因为新选项在页面加载后加载时没有采用 CSS 样式。我该如何解决这个问题?

4

2 回答 2

0

浏览器应该立即应用 CSS,即使新的东西被添加到 DOM 中。您是否使用选择框替换脚本通过 CSS 设置选择框样式?

于 2012-07-12T15:16:52.310 回答
0

可以使用 Jquery 完成
给你的样式,按钮 ids

jQuery(function($) {
var $output = $('#output')
  , $style = $('#styles')
  , $button = $('#preview')
;
$ed.val($style.html());
$button.click(function() {
    $style.html($output.val());
    return false;
});
});
于 2012-07-12T16:17:47.873 回答