如何使用列表项作为表单中的值？

Question

我有一个客户要求我们做的功能，其中大量的项目列表按类型缩小（使用jquery隐藏除了选择之外的所有项目）并且它们看起来都非常花哨...... < / p>

现在，他要求我将这些花哨的“类型”列表（带有漂亮的图标，并弹出描述）添加到表单中，以替换选择的下拉列表。这些值都是一样的，但我不明白如何在表单中点击其中一个按钮。

我想也许每个项目都可以是一个单选按钮，所以它的值取决于选中哪个单选按钮（或选中图标），但我不知道如何做到这一点。

任何建议都很棒。感谢。

Answer 1

只需让您的下拉框不可见，并将事件绑定到列表项，并在点击一个项目时更新您的下拉框。

JS示例

$('#items li').click(function(){
   $('#my_drop_down_box').value($(this).attr('rel'));
});

HTML示例

<ul id="items">
  <li rl ="1">Item 1</li>
  <li rel="2">Item 2</li>
</ul>