2014-04-04 72 views
-1

根据要求,我想将令牌输入从一个div移动到另一个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> 

能有这方面的一个帮助...

+0

是否需要令牌输入的状态:

更改您的密码?如果不是,我重新初始化图像将是最好的举措。 – Chris

+0

@Chris重新初始化将不起作用插件重复输入 –

回答

3

当您使用的.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(''); 
    } 
} 
+0

感谢它的工作 – CNKR

相关问题