Javascript 基础5下拉按钮不在嵌套表行中工作
如果下拉按钮位于嵌套表行内,则下拉按钮不起作用 请参考jsbin中的示例:Javascript 基础5下拉按钮不在嵌套表行中工作,javascript,html,css,ember.js,zurb-foundation-5,Javascript,Html,Css,Ember.js,Zurb Foundation 5,如果下拉按钮位于嵌套表行内,则下拉按钮不起作用 请参考jsbin中的示例: 单击标题1以显示展开的表行 然后,单击下拉按钮1。单击按钮后,下拉菜单不会出现 单击标题2以显示展开的表行 然后,单击+按钮。单击按钮后,下拉菜单不会出现 但是,如果下拉按钮位于表格行本身,则下拉按钮在两个位置(即表格行和嵌套表格行)都可以正常工作 请参阅此示例: 单击下拉按钮1。单击按钮后,将出现下拉菜单 单击标题2以显示展开的表行 然后,单击+按钮。单击按钮后,将出现下拉菜单 我不知道为什么下拉按钮会出现这种
- 单击标题1以显示展开的表行李>
- 然后,单击下拉按钮1。单击按钮后,下拉菜单不会出现
- 单击标题2以显示展开的表行李>
- 然后,单击+按钮。单击按钮后,下拉菜单不会出现
- 单击下拉按钮1。单击按钮后,将出现下拉菜单
- 单击标题2以显示展开的表行李>
- 然后,单击+按钮。单击按钮后,将出现下拉菜单
我不知道为什么下拉按钮会出现这种情况。非常感谢为解决此问题提供的任何帮助。谢谢大家! 我以您的工作示例为例,将其包装在与您的坏示例()相同的
{{{if}}
语句中,它不再工作
这是因为您正在初始化App.ApplicationView
的didInsertElement
挂钩上的foundation
下拉列表
问题是,当您初始化基础时,DOM中没有<代码> >下拉> /代码>,当“代码> App.ApvestValue<代码>被插入时,它们被<代码> {{IF } 语句所隐藏。这些
{{if}
标记实际上在DOM中删除和插入HTML blob
<> p>所以你需要做的是找到一个知道下拉已经被插入并重新初始化基础的方法。p>
Foundation使用$(document)处理重新初始化
将再次检查DOM中的任何内容,并为其重新应用javascript
重新初始化了<代码> ToGeLoeDebug Actudio,就像正在插入按钮的时候一样。
真的,你应该注意不要依赖基础来隐藏你的DopDrand,看看添加<代码> {{Actudi}} /代码>钩子并手动管理显示/隐藏。这一问题已在此处得到解答,请查看。谢谢@PhilHauser回复并解释我的代码有什么问题。关于您共享的更新内容,下拉菜单似乎仅适用于
标题2
的下拉按钮。但是,当你点击header2
上的下拉按钮后,header1
上的下拉菜单也会起作用。至于SO问题,我在我的代码上试过了,在添加{{action}
钩子手动切换下拉菜单show/hide后,效果很好。但是,使用此方法,下拉菜单不会自动关闭。目前,我正在寻找手动关闭下拉菜单的方法。至于我共享的JSBIN,你正确地认为第一下拉不起作用,这是因为我在按钮在DOM之前重新初始化基础。为了说明这一点,我用了一个令人作呕的超时设置。如果您使用新的{{action}
钩子方式发布另一个JSbin,我可以看一看。