如何使用jquery移动嵌套元素
How to move nested elements using jquery
我正在尝试移动嵌套列表。当父节点被选中时,子节点也应该被移动。当选择了子元素时,应该复制父元素并移动子元素,这样结构才会被保留。有人可以给我指出正确的方向,当我开始编码时,它变得过于复杂。
下面是一个使用的示例,没有嵌套。http://jsfiddle.net/EEhbQ/html: <ul id="select1">
<li>
<label>
<input type="checkbox" name="CheckboxGroup1" value="checkbox" id="CheckboxGroup1_0" />Checkbox 1</label>
</li>
<li>
<label>
<input type="checkbox" name="CheckboxGroup1" value="checkbox" id="CheckboxGroup1_1" />Checkbox 2</label>
</li>
<li>
<label>
<input type="checkbox" name="CheckboxGroup1" value="checkbox" id="CheckboxGroup1_2" />Checkbox 3</label>
</li>
</ul>
<ul id="select2">
<li>
<label>
<input type="checkbox" name="CheckboxGroup2" value="checkbox" id="CheckboxGroup2_0" />Checkbox 4</label>
</li>
<li>
<label>
<input type="checkbox" name="CheckboxGroup2" value="checkbox" id="CheckboxGroup2_1" />Checkbox 5</label>
</li>
<li>
<label>
<input type="checkbox" name="CheckboxGroup2" value="checkbox" id="CheckboxGroup2_2" />Checkbox 6</label>
</li>
</ul>
<a href="#" id="add">add</a>
<a href="#" id="remove">remove</a>
Jquery: $('#add').click(function() {
return !$('#select1 li :checked').closest('li').appendTo('#select2');
});
$('#remove').click(function() {
return !$('#select2 li :checked').closest('li').appendTo('#select1');
});
你在找这样的东西吗?——http://jsfiddle.net/jayblanchard/EEhbQ/18/
$('#add').click(function () {
return !$('#select1 li :checked').closest('ul').appendTo('#select2');
});
$('#remove').click(function () {
return !$('#select2 li :checked').closest('ul').prependTo('body');
});
相关文章:
- 多个嵌套元素上的jQuery.text('')
- 如何在不丢失格式的情况下连续淡入() 元素文本的每个字符,包括嵌套元素
- 选择嵌套元素
- iframe作为pre元素的嵌套元素
- 使用 javascript 通过 tag->id->element 获取嵌套元素
- Node.js:用作对象嵌套元素名称的变量
- mousemove抓取嵌套元素的XY偏移
- 事件委派模式,在按钮中使用 addEventListener 和嵌套元素
- 导轨和挖空.js绑定嵌套元素而不在fields_for中使用foreach
- jQuery切换动态生成的嵌套元素
- 如何使嵌套元素在可拖动容器中不可拖动
- KNOCKOUTJS 映射嵌套元素不是绑定的
- 在鼠标悬停时更改容器和嵌套元素的内部HTML内容
- 在单击嵌套元素时将类添加到同级
- 量角器根据条件单击嵌套元素,错误 - 在指定的超时内未调用异步回调
- 如何使用 Jquery/Javascript 在嵌套元素前面置置
- 防止嵌套元素触发父元素的事件
- 由于嵌套元素,单击侦听器激发两次
- 使用嵌套元素处理触摸事件
- 换行<td><a>标记,同时避免嵌套元素