1

大家好，我正在研究 jquery，我有一个像这样的 html 代码

<div>
    <span class="span1">
      <label class="checkbox" />
          <input type="checkbox" class="regular-checkbox" id="Header" />
          <label for="Header"></label>
      </label>
    </span> 
    <span class="span1">Images</span> 
    <span class="span1">SKU</span>
    <span class="span2">Name</span> 
    <span class="span1">Price</span>                             
</div>

<div id="separate"></div>
      <input type="button" id="button" />

我试过这样它不起作用

<script type="text/javascript">
    $(document).ready(function(){
    $(#button).click(function(){
   $(function () {

      $("input:checkbox").toggle(function () {
         $("#Header").appendTo("#separate");
      },function () {
         $("#separate").appendTo($(this));
      });
      });

   });
</script>

我有这个DIV，我有一个checkbox从这里我有一个图像，价格和名称（手机）。这是我的代码，当我选择 时，我有一个“href”图标，我提交了checkbox图像，价格和名称应该移动到另一个DIV我该怎么做，当我取消选择时checkbox？它应该切换。你能帮我解决这个问题吗，在此先感谢。

4

2 回答 2

2

我就是这样做的。http://jsbin.com/umivoc/1/

JavaScript：

$(function () {
  // Check if user clicks on the checkbox
  $("#Header").click(function() {

    if($('#Header').is(':checked')){

      // If the checkbox becomes checked, 
      // move the contents to our new div (div2)
      $("#div1").contents().appendTo("#div2");
    } else {

      // Otherwise we can assume it is being unchecked, 
      // so move everything back to it's original div (div1)
      $("#div2").contents().appendTo("#div1");
    }
  });
});


HTML 标记：
我清理了你的标记，你有开放的标签标签，你可能应该把你想要移动的元素放在他们自己的包装器 div 中，以使事情变得简单。

<span class="span1">
   <label for="Header"></label>
   <input type="checkbox" class="regular-checkbox" id="Header" />
</span> 
<div id="div1">
   <span class="span1">Images</span> 
   <span class="span1">SKU</span>
   <span class="span2">Name</span> 
   <span class="span1">Price</span>                             
</div>
<div id="div2"></div>
于 2012-11-20T07:59:33.937 回答
0

目前还不是很清楚你需要什么，但可能会导致解决方案：

<input type="checkbox" class="regular-checkbox" id="Header" />
<br/>
Pos:1
<div id="oryginal">
    <span class="span1">Images</span> 
    <span class="span1">SKU</span>
    <span class="span2">Name</span> 
    <span class="span1">Price</span>
</div>                           
<br/>
Pos:2
<div id="separate"></div>​

$("input:checkbox").toggle(
   function () {
         $("#oryginal span").appendTo("#separate");
      },function () {
         $("#separate span").appendTo("#oryginal");
      });
于 2012-11-20T08:04:57.950 回答