Question

根据要求，我想将令牌输入从一个div移动到另一个div。

我能够将令牌输入数据从一个div移动到另一个div，但令牌输入功能在其他div中不起作用。

以下是代码

<html>
<head>
    <script type="text/javascript" src="jquery-1.11.0.min.js" ></script>
    <script type="text/javascript" src="jquery.tokeninput.js" ></script>
    <link type="text/css" href="token-input.css"  rel="stylesheet"></link>
    <script type="text/javascript">
        $(document).ready(function() {
                initialize();
        });
        function initialize() {
            $("#demo-input").tokenInput([
                {id: 7, name: "Ruby"},
                {id: 11, name: "Python"},
                {id: 13, name: "JavaScript"},
                {id: 17, name: "ActionScript"},
                {id: 19, name: "Scheme"},
                {id: 23, name: "Lisp"},
                {id: 29, name: "C#"},
                {id: 31, name: "Fortran"},
                {id: 37, name: "Visual Basic"},
                {id: 41, name: "C"},
                {id: 43, name: "C++"},
                {id: 47, name: "Java"}
            ]);
        }
        function change() {
            if( $(".div2").html().trim().length == 0 ) {
                $(".div2").html( $(".div1").html() );
                $(".div1").html('');
            } else {
                $(".div1").html( $(".div2").html() );
                $(".div2").html('');
            }
        }
    </script>
</head>
<body>
    <div class="div1" style="border:1px solid red">
        <input type="text" id="demo-input" name="blah" />
    </div>

    <input type="button" onclick="change()"  value="ClicktoMove" />
    <div class="div2"  style="border:1px solid yellow">

    </div>
</body>

任何人都可以帮忙...

Answer 1

当您使用.html（）时，孩子们将失去绑定到它的事件。

如果您只是将一个元素从一个地方复制到另一个地方，则可以使用.clone(true)

如果要移动多个元素（如您的情况），则需要使用element.contents()

有关详细信息，请阅读this。

这是Demo。

您的代码更改：

function change() {
    if($.trim($(".div2").html()).length === 0 ) {
        $(".div2").html($(".div1").contents());
        $(".div1").html('');
    }
    else
    {
        $(".div1").html( $(".div2").contents() );
        $(".div2").html('');
    }
}

令牌输入 - 从一个div移动到另一个div

1 个答案: