jquery 设置加载后的高度

2024-01-26

我在设置动态加载的元素的高度时遇到了一些麻烦。

我用jqueryload函数将外部(动态)页面加载到当前页面上的 div (#cbox) 中。因为这个子页面是动态的,所以我无法事先知道内容的高度是多少。我想在加载内容后获取高度,并将容器 div 的高度设置为匹配,以便我的颜色背景 css 一直向下。我仅在CSS中尝试了许多100%高度div的变体,但是一旦我滚动页面,颜色就会向上滚动(100%似乎只设置浏览器窗口高度的100%,并且b/c内容是动态的加载它不起作用。我的解决方案是将 div 的高度设置为加载内容的高度,但这仅适用于第二次单击(因为此时页面已加载并可访问。我需要弄清楚什么如何做是在外部页面加载后更改 div 的高度,但我似乎无法弄清楚)。

我希望这对某人来说是可以理解的,我意识到这有点令人费解。

这是我的 onclick 代码:

jQuery('#cbox').load('externalpage.php');
jQuery('#cbox').height(jQuery('#content').height());

更新: 如果我想设置该 div 的高度,下面的解决方案有效。但现在我发现,如果内容高度比窗口高,我只想将其设置为 div 高度。否则我希望将其设置为 100%。我尝试将他们的代码稍微修改为这个(onlick事件):

jQuery('#cbox').load('<?php the_permalink(); ?>', function() 
   { 
      if (jQuery('#cbox').height() < jQuery('#content').height()) 
      {
         jQuery('#cbox').height(jQuery('#content').height()); 
      } 
      else
      { 
         jQuery('#cbox').height('100%'); 
      }
   });

但它不起作用...有什么想法吗?


内容加载后需要调用回调函数。

jQuery('#cbox').load('externalpage.php', function() {
   jQuery('#cbox').height(jQuery('#content').height());
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jquery 设置加载后的高度 的相关文章

  • 如何使按钮在表格单元格内居中

    我试图通过以下方式将按钮置于表格内的中心 text align center 然而 它似乎对我不起作用 注 我用过Display table cell结合Vertical align middle将按钮的文本居中 正如您所看到的 第一个按钮
  • wp_unregister 和 wp_enqueue

    有人建议我使用 wp unregister 和 wp enqueue 将 wordpress jquery 库替换为 google 托管的库 因为 wordpress 有一些问题 然而 当我尝试将这些插入我的 WordPress 网站时 它
  • 如何在没有 JQuery 的情况下模仿跨浏览器 $(document).ready() 行为[重复]

    这个问题在这里已经有答案了 可能的重复 document ready 相当于没有 jQuery https stackoverflow com questions 799981 document ready equivalent witho
  • 如何更改chart.js中的标签颜色?

    我有一个像这样定义的饼图 var myChart new Chart ctx type doughnut data labels data labels datasets data data values backgroundColor r
  • 在 Web 浏览器中查找触发 then 事件的 jQuery 代码

    我加入了一个团队来从事一个项目 现在他们使用 jQuery 并且很多 javascript 文件都是外部文件而不是嵌入的 当我点击一个按钮时 它看起来就像 a class button cancel Cancel a 它触发一个在一个 ja
  • 如果我拒绝确认,如何防止更改选择框值

    我正在使用国家 地区选择框 当用户选择一个国家 地区时 会出现添加分支链接 并且用户在该国家 地区下添加分支 但是当用户想要更改国家 地区时 则应销毁有关该国家 地区的所有分支 在更改国家 地区之前 会出现一个确认框并显示警告 一切正常 但
  • 双弧形

    我目前正在尝试生成 波浪形幽灵底部 形状 该形状包含两条双曲线 虽然底部的部分这个图片 http images clipartpanda com ghost clip art castle ghost clipart1 jpg我认为以更好的
  • jQuery 中的 Javascript .files[0] 属性

    jQuery 中是否有与此语句等效的语句 var value document getElementById id files 0 使用附加 files 0 的标准 jQuery 选择器似乎不起作用 并且我找不到与 files 等效的 jQ
  • 如何动态添加和删除jquery选项卡?

    我有一个 aspx 页面 上面有 2 个静态 jquery 选项卡 单击其中一个选项卡上的按钮后 我想动态添加一个新选项卡 该选项卡从另一个 aspx 页面加载其内容 我也尝试使用以下示例 http jquery ui googlecode
  • 使用模态表单 ajax 超出 HTMLFormElement.toString 的最大调用堆栈大小

    我想使用模态窗口中的 ajax 请求提交表单 单击此链接可打开该模式 a class btn btn primary i class fa fa edit i Write a review a 模态窗口 div class modal fa
  • jQuery 验证规则和消息 [关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 我在设置 jQuery 验证的规则和
  • Aptana Studio 3 上的预览选项卡在哪里?

    我在 Windows PC 上使用 Aptana Studio 2 并有一个选项卡用于在 IE 上预览页面 另一个选项卡用于在 Firefox 上预览 但我切换到了 Aptana 3 我不知道是没有预览还是我没有找到它 是的 我在 stac
  • jQuery 选择器:为什么 $("#id").find("p") 比 $("#id p") 更快

    该页面的作者 http 24ways org 2011 your jquery now with less suck http 24ways org 2011 your jquery now with less suck断言 jQuery
  • css 计数器在 Internet Explorer 中无法工作以获取隐藏内容 - 如何修复?

    我们想要一些编号列表 并发现了这个很酷的计数器 您可以在 css 中使用它来让浏览器为您计算数字 ol instructions counter reset instructions section ol instructions gt l
  • 如何在jQuery datetimepicker中获取UTC时间

    我正在使用尝试这个jQuery 日期时间选择器 http trentrichardson com examples timepicker 获取日期和时间数据 我能够得到大部分内容 格式 显示等 但是 我无法获取 UTC 格式的日期和时间 我
  • jQuery 选择下一个

    我有一个简单的div布局html 有一个函数 当鼠标悬停在className为 personal icon email 的div上时 我将调用JS函数并显示className为 img info mask 的隐藏div div class
  • Fancybox 画廊组

    我正在使用 fancyboxhttp fancyapps com fancybox http fancyapps com fancybox 我的问题是 我可以将不同的资源组合在一起吗 我的意思是同一画廊 或 组 中带有内嵌或视频的图像 如果
  • 有没有非常轻的灯箱? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • CSS - 第一个没有特定类别的孩子

    是否可以编写一个 CSS 规则来选择没有特定类的元素的第一个子元素 example div span class common class ignore span span class common class ignore span sp
  • 位置:绝对在边框半径内且溢出:隐藏

    我遇到了问题border radius在webkit浏览器中找到了解决方案 网址如下 如何在 Chrome Opera 中使 CSS3 圆角隐藏溢出 https stackoverflow com questions 5736503 how

随机推荐