Question

我有2个Div标记设置如下

<div id="sortlocation" class="facetsearch">
    <div class="facetlist">
       <div id="facet_20" class="facetitem">Adambakkam <span class="facetitemcount">(15)</span></div>
       <div id="facet_12" class="facetitem">Ambattur <span class="facetitemcount">(59)</span></div>
       <div id="facet_17" class="facetitem">Anna Nagar <span class="facetitemcount">(18)</span></div>
    </div>
</div>

我需要将具有id newpar的div转换为下拉菜单（选择菜单）。是可能的......

看到这个，我举了一个例子，说明我需要jsfiddle.net/varunms/WXK7S/5

Answer 1

这样的东西？

var s = $('<select />');
$('.facetlist .facetitem').each(function() {
   $('<option />', { 
       id: $(this).attr('id'), 
       'class': $(this).attr('class') 
   }).html($(this).text()).appendTo(s);
});
s.appendTo('body');

Demo

当然，上面只是一个关于如何创建的演示。要获得正确的替换，请使用jQuery replaceWith

$('.facetlist').replaceWith(s);

Demo

Answer 2

是的，这是可能的。

这有两个部分： 1.从div中获取选项这可以使用documnet.getElementsByClassName完成。然后，您可以轻松地访问每个div的内部。

创建选择框您可以制作HTML字符串（yuck）或执行以下操作： http://supunk.blogspot.com/2009/01/creating-select-list-using-javascript.html
将选择框放在您需要的位置如果您选择了HTML字符串版本，则可以设置sortlocation div的innerHTML

更改分区以选择输入

2 个答案: