javascript - 如何确保内联 jQuery 脚本在 HTML 页面中最后执行?

标签 javascript jquery html css inline

我在尝试动态设置我的一些 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/SmashingDashing Icinga创建仪表板。 <div>里面 block 还有其他几个<div>由后端脚本在运行时创建的 block ,生成实际的小部件内容。

正如你从最后的脚本片段中看到的那样,我试图在运行时同时调整现有的 div 以及它的一个子 div 的 CSS,我只需要确保这段代码在我原来的 div 的 child 之后 被处决已加载。我怎样才能做到这一点?

最好的问候 丹尼尔

最佳答案

您可以直接使用 CSS。您不需要使用 javascript。

<style>
.scrollable {
    overflow: hidden;
}
.scrollable .content {
    height: 100%;
    margin-right: -50px;
    padding-right: 50px;
    overflow-y: scroll;
}
</style>

关于javascript - 如何确保内联 jQuery 脚本在 HTML 页面中最后执行?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58975400/

相关文章:

javascript - 为什么 .splice 的输出是单个对象?

javascript - 为什么 Angular.element/jqlite 找不到顶级元素?

jquery - 如何使用jquery从正文中隐藏滚动条

javascript - 正确触发 onmouseup 元素

javascript - 如何创建仅匹配 1 或 2 的正则表达式

html - 如何使居中的 div 拉伸(stretch)到屏幕的 100%?

javascript - 查找数组的最大切片 | Javascript

javascript - 如何在不将文本包装在 span 中的情况下在 ReactJS 中输出文本

javascript - 从 <li> 中删除项目

html - <article> 或 <section> 标签之间的混淆。使用哪个?