Question

我在我正在使用的表单中实现了一个Foundation 4下拉列表。

自定义下拉菜单未绑定到我点击的项目的相应值。

在4个标签的列表中，第一个项目将被正确选择，但所有其他项目将绑定到之前的项目......

Binds to option 1 - <li class="">Mr</li>
Binds to option 1 - <li class="">Mrs</li>
Binds to option 2 - <li class="">Miss</li>
Binds to option 3 <li class="">Ms</li>

1 - <option value="Mr">Mr</option>
2 - <option value="Mrs">Mrs</option>
3 - <option value="Miss">Miss</option>
4 - <option value="Ms">Ms</option>

奇怪的是，当您第二次点击或选择时，它会绑定到正确的项目。

我已经复制了几个类似结果的测试。

有没有人遇到类似的东西？

Answer 1

如果您真的使用Zurb Foundation下拉元素，那么使用Zurb的语法创建下拉菜单是明智的。通常，这是应该用于DropDown按钮的语法：

<a href="#" data-dropdown="drop" class="button dropdown">Dropdown Button</a><br>
<ul id="drop" data-dropdown-content class="f-dropdown">
  <li><a href="#">This is a link</a></li>
  <li><a href="#">This is another</a></li>
  <li><a href="#">Yet another</a></li>
</ul>

OR用于基本的DropDown控件：

<a href="#" data-dropdown="drop1">Has Dropdown</a>
<ul id="drop1" class="f-dropdown" data-dropdown-content>
  <li><a href="#">This is a link</a></li>
  <li><a href="#">This is another</a></li>
  <li><a href="#">Yet another</a></li>
</ul>
<a href="#" data-dropdown="drop2">Has Content Dropdown</a>
<div id="drop2" data-dropdown-content class="f-dropdown content">
  <p>Some text that people will think is awesome! Some text that people will think is awesome! Some text that people will think is awesome!</p>
</div>

更多文档可在Zurb基金会网站上找到：http://foundation.zurb.com/docs/components/dropdown_buttons.html http://foundation.zurb.com/docs/components/dropdown.html

如果我没有回答你的问题，或者你的问题没有被误解，或者你认为这是其中一个基金会库中的错误，我还建议升级到Foundation5（这是最近发布的最新版本）。

我希望这会有所帮助。如果我误解了或者可以帮助我，请告诉我。

-Mike

基础4自定义下拉菜单不绑定数据

1 个答案: