1、父页面增加的select选项,并引用iframe链接

2、与上图同在一个页面,使用iframe嵌套显示具体内容
<div class="healthprtcontent">
<iframe src="editright.html" id="iframepage" name="iframepage" frameborder="0" class="layadmin-iframe">
</iframe>
</div>
3、iframe页面dom 定义id 与父页面value值相对应。

4、由于使用layui框架,这里用form监听获取到select的选中值实现跳转
/**监听select*/
form.on('select(healthSelect)', function (data) {
var healthVal = data.value;//获取唯一属性值
window.frames["iframepage"].document.getElementById('' + healthVal + '').scrollIntoView();
})
本文详述了如何在父页面中通过Select组件选择项的变化,触发IFrame内特定DOM元素的滚动显示。利用layui框架的form监听功能,实现了跨页面元素间的交互。关键步骤包括:设置IFrame源文件,定义对应ID的DOM元素,以及使用JavaScript监听Select变化并调整IFrame视图。
751

被折叠的 条评论
为什么被折叠?



