如何确保内联 jQuery 脚本在 HTML 页面中的所有内容中最后执行？

Question

尝试动态设置我的一些 html 样式时遇到问题。设置如下：

<h1>Title</h1>

<div class="gridster">

  <ul>

    [...]

    <li data-row="1" data-col="1" data-sizex="1" data-sizey="1">

      <div data-id="someid" class="scrollable" data-view="List" data-unordered="true" data-title="someTitle"></div>

    </li>

  </ul>

</div>

<script>

$(window).load(function() {

  $(".scrollable").css("overflow", "hidden");

  $(".scrollable").children(".content").css("height", "100%");

  $(".scrollable").children(".content").css("overflow-y", "scroll");

  $(".scrollable").children(".content").css("margin-right", "-50px");

  $(".scrollable").children(".content").css("padding-right", "50px");

});

</script>

我正在使用Dashing/Smashing和Dashing Icinga来创建仪表板。在该<div>块内，还有其他几个<div>由后端脚本在运行时创建的块，生成实际的小部件内容。

你可以从最终的剧本片段看到，我试图同时调整，对已经存在的div的以及它的孩子将要div的在运行时CSS的一个，我只是需要确保该代码被执行后我原来的孩子div已经加载。我怎样才能做到这一点？

Answer 1

你可以直接用 CSS 做。您不需要使用 javascript。<style>.scrollable {&nbsp; &nbsp; overflow: hidden;}.scrollable .content {&nbsp; &nbsp; height: 100%;&nbsp; &nbsp; margin-right: -50px;&nbsp; &nbsp; padding-right: 50px;&nbsp; &nbsp; overflow-y: scroll;}</style>