通过选择在一个div中添加多个列表

时间:2014-01-29 08:02:11

标签: javascript jquery

在这个,如果我可以选择一个列表,并希望另一个添加我可以做什么,我必须在此添加多个列表,点击添加更多过滤器按钮 这是我的HTML代码ido一切但没有任何反应我必须添加多个列表一个ny一个选择

     <div class="slider_slect">
                                    <div class="fl"><dl id="sample" class="dropdown">
                                        <dt><a href="#"><span><img class="flag" src="images/select_arrow.gif" alt="" /></span></a></dt>
                                        <dd>
                                            <ul>
                                                <li><a href="#"><img class="flag" src="images/select_img1.gif" alt="School" title="School"/></a></li>
                                                <li><a href="#"><img class="flag" src="images/select_img2.gif" alt="Grade" title="Grade" /></a></li>
                                                <li><a href="#"><img class="flag" src="images/select_img3.gif" alt="Gender" title="Gender" /></a></li>
                                                <li><a href="#"><img class="flag" src="images/select_img4.gif" alt="Group" title="Group" /></a></li>
                                                <li><a href="#"><img class="flag" src="images/select_img5.gif" alt="Race" title="Race" /></a></li>
                                                <li><a href="#"><img class="flag" src="images/select_img6.gif" alt="Teacher" title="Teacher" /></a></li>
                                                <li><a href="#"><img class="flag" src="images/select_img7.gif" alt="Parent" title="Parent" /></a></li>
                                                <li><a href="#"><img class="flag" src="images/select_img8.gif" alt="Student" title="Student" /></a></li>
                                            </ul>
                                        </dd>
                                    </dl>
                                    </div>

                                    <div class="fl">
                                        <dl id="sample2" class="dropdown2">
                                            <dt><a href="#"><span></span></a></dt>
                                            <dd>
                                                <ul>
                                                    <li><a href="#">Value Here</a></li>
                                                    <li><a href="#">Value Here</a></li>
                                                    <li><a href="#">Value Here</a></li>
                                                    <li><a href="#">Value Here</a></li>
                                                    <li><a href="#">Value Here</a></li>
                                                    <li><a href="#">Value Here</a></li>
                                                    <li><a href="#">Value Here</a></li>
                                                    <li><a href="#">Value Here</a></li>
                                                </ul>
                                            </dd>
                                        </dl>
                                    </div>
                            </div>

                   <div id="add_dd"></div>
                            <div class="add_more_btn2">
                                <a href="javascript:;" onClick="addAnswer(); return false;">Add More Filters<span>+</span></a>
                            </div>

这是我的javascript文件

        $(".add_more_btn2").click(function(e) {
       var abc='<div class="slider_slect"><div class="fl"><dl id="sample" class="dropdown"><dt><a href="#"><span><img class="flag" src="images/select_arrow.gif" alt="" /></span></a></dt><dd><ul><li><a href="#"><img class="flag" src="images/select_img1.gif" alt="School" title="School"/></a></li><li><a href="#"><img class="flag" src="images/select_img2.gif" alt="Grade" title="Grade" /></a></li><li><a href="#"><img class="flag" src="images/select_img3.gif" alt="Gender" title="Gender" /></a></li><li><a href="#"><img class="flag" src="images/select_img4.gif" alt="Group" title="Group" /></a></li><li><a href="#"><img class="flag" src="images/select_img5.gif" alt="Race" title="Race" /></a></li><li><a href="#"><img class="flag" src="images/select_img6.gif" alt="Teacher" title="Teacher" /></a></li><li><a href="#"><img class="flag" src="images/select_img7.gif" alt="Parent" title="Parent" /></a></li><li><a href="#"><img class="flag" src="images/select_img8.gif" alt="Student" title="Student" /></a></li></ul></dd></dl></div><div class="fl"><dl id="sample2" class="dropdown2"><dt><a href="#"><span></span></a></dt><dd><ul><li><a href="#">Value Here</a></li><li><a href="#">Value Here</a></li><li><a href="#">Value Here</a></li><li><a href="#">Value Here</a></li><li><a href="#">Value Here</a></li><li><a href="#">Value Here</a></li><li><a href="#">Value Here</a></li><li><a href="#">Value Here</a></li></ul></dd></dl></div></div>';
   var exist=$("#add_dd").html();
     $("#add_dd").html(exist+abc);
     $('.slider_slect').appendTo($("#add_dd"));
    });

1 个答案:

答案 0 :(得分:0)

老兄理解你的问题是一团糟告诉我这是你想要的吗?

了解jquery的.append()

here is a demo link