我刚刚开始使用Foundation 5获得一点经验 . 我正在尝试使用垂直选项卡实现表单“向导”,以便用户可以通过单击相应的选项卡来浏览表单的各个部分 . 它适用于指向页面内容的每个选项卡 . 但是对于我的一个标签,我希望链接指向与包含垂直标签内容的页面不同的页面 . 我在选项卡的'dd'中为'a'插入了正确的url,并在选项卡上滚动我在浏览器中显示了正确的链接URL,但点击不会将我带到新页面,它只是让我离开我在表格上的位置 .
有没有办法使这项工作,或者标签hrefs只能成功指向“#something”而不是“/ users / edit”?
在下面的代码段中,应该指向离页的链接是“/ users / edit”链接 .
<dl class="tabs vertical" data-tab data-options="deep_linking:true scroll_to_content:false">
<dd class="account_edit">
<a href="/users/edit" class="account_section_tab">Registration Info</a>
</dd>
<dd class="active account_edit">
<a href="#billing_address" class="account_section_tab">Billing Address</a>
</dd>
<dd class="account_edit">
<a href="#contact_info" class="account_section_tab">Contact Info</a>
</dd>
<dd class="account_edit">
<a href="#payout_settings" class="account_section_tab">Payout Settings</a>
</dd>
<dd class="account_edit">
<a href="#notifications" class="account_section_tab">Notifications</a>
</dd>
</dl>
<%= simple_form_for(@account, url: user_account_path(current_user), html: { method: :put }) do |f| %>
<div class="tabs-content vertical">
<%= render :partial => 'users/accounts/billing_address', :locals => { :f => f } %>
<%= render :partial => 'users/accounts/contact_info', :locals => { :f => f } %>
<%= render :partial => 'users/accounts/payout_settings', :locals => { :f => f } %>
<%= render :partial => 'users/accounts/notifications', :locals => { :f => f } %>
</div>
<% end %>
更新
我在另一个SO问题中注意到,通过删除主标签集的主dl标签中的“data-tab”选项,可以使所有选项卡都有效 . 但是因为我只想让我的五个标签之一发生这种情况,所以这个选项似乎对我不开放 .
谢谢,
院长
1 回答
如果你想学习如何制作J $链接,请visit this stackoverflow question .
我相信这条路线是你最好的选择"force"要链接的东西 . 别忘了添加
CSS
cursor: pointer;
到您的:hover
类 .