有没有办法使用jquery将下拉菜单转换为列表...所以:
<select>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
到
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
由于
答案 0 :(得分:8)
只需遍历<option>
元素并为每个元素创建相应的<li>
,然后将其添加到<ul>
,如下所示:(其中#menu
是ID你的下拉菜单
var list = $('<ul>');
$('#menu option').each(function() {
$('<li>').text($(this).text()).appendTo(list);
});
list.appendTo($('body'));
答案 1 :(得分:2)
最初在span中包裹select,如下所示 -
试试这个 -
<span id="replace">
<select id="test">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</span>
var html = '<ul>';
$('#test option').each(function(){
html += '<li>'+$(this).text()+'</li>';
});
html += '</ul>';
$('#replace').html(html);
答案 2 :(得分:0)
魔术!!!
如果您以任何方式获取数据
用.html()或.text()替换下拉列表。
填充ul和li并将其连接成一个变量,如
var newcontent = "<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul> "
我假设选择框位于id为“content”的div中
将内容替换为('#content').html(newcontent )
或文字。
NB。您应该获取数据并创建ul li。然后你可以替换
答案 3 :(得分:0)
标记名称在DOM元素中是不可变的。如果可能,您应该考虑在源代码中包含两者,然后使用toggle()
切换