Question

我有一个选择选项，一个列表和一个按钮。单击该按钮时，将删除所选选项并将其放入列表中。当单击列表中的li时，它将被放回select选项中并自行删除。这是我的代码：

                            <select id="selLanguage" >
                                 <option value="1">English</option>
                                 <option value="2">Spanish</option>
                                 <option value="3">German</option>
                            </select>

                             <ul id="ulLanguage">
                             </ul>

                             <button id="btnAddLanguage">Language</button>

            //ADD LANGUAGE
            $(function() {
                $("#btnAddLanguage")
                .button()
                .click(function() {

                    $("#ulLanguage").append("<li id='"+$("#selLanguage :selected").val()+"' onclick='remove(this);' style='cursor:pointer'>"+$("#selLanguage :selected").text() +" </li>");
                    $("#selLanguage option[value='"+$("#selLanguage :selected").val()+"']").remove();


                });
            });
            //REMOVE LANGUAGE
            $("#ulLanguage").on("click","li", function(){

                $("select#selLanguage").append("<option value='"+$(this).val()+"' >"+$(this).text()+"</li>");
                $(this).remove();
            });

它可以工作，但是当我添加三个选项时，我删除了三个选项并将它们放回到选择中（直到这里没问题），然后我再次添加一个选项，它会删除选择中的所有选项，而不是只选了一个。我不知道我犯了什么错误，我对jquery很新，所以我不得不问这个。任何帮助将非常感激。感谢。

Answer 1

缺少一些内容：

你的第二个回调是在jquery ready回调
您将注入选择一个以li：

追加（“＆lt; 选项 value ='”+ $（this）.val（）+“'＆gt;”+ $（this）.text（）+“＆lt; / <强>利＆gt;“中）;

当你在select中放回项目时，你不保留li.id值，因此错误。

更正版本低于

        $(function() {
            $("#btnAddLanguage")
            .on('click', function() {

                $("#ulLanguage").append("<li id='"+$("#selLanguage :selected").val()+"' style='cursor:pointer'>"+$("#selLanguage :selected").text() +" </li>");
                console.log($("#selLanguage :selected").val());
                $("#selLanguage option[value='"+$("#selLanguage :selected").val()+"']").remove();


            });

        //REMOVE LANGUAGE
        $("#ulLanguage").on("click","li", function(){

            $("select#selLanguage").append("<option value='"+$(this).attr('id')+"' >"+$(this).text()+"</option>");
            $(this).remove();
        });                 
        });

将选项中的项目添加到列表中，然后将其放回

1 个答案: