- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用?
- database - RESTful URI 是否应该公开数据库主键?
使用 jquery 将 div 列表中的 div 复制/克隆到另一个容器中的相应位置的最佳方法是什么。
我尝试将所有“copy-this”元素复制到另一个容器中的相同位置。所以首先“.copy-this”应该复制到第二个容器的第一项中,与 (2)->(2) 等相同...
HTML DOM:
<div class="content">
<div class="item">
<div class="copy-this">Some info</div>
<div class="random-div">Not to copy</div>
</div>
<div class="item">
<div class="copy-this">Some info 2</div>
</div>
<div class="item">
<div class="copy-this">Some info 3</div>
<div class="random-div">Not to copy</div>
</div>
<div class="item">
<div class="copy-this">Some info 4</div>
</div>
</div>
<div class="content">
<div class="item">
</div>
<div class="item">
<div class="random-div">Not to copy</div>
</div>
<div class="item">
</div>
<div class="item">
</div>
</div>
最佳答案
编辑
OP 要求在视口(viewport)大小(窗口宽度)条件下的行为是克隆在 600 像素或更小时出现。
How would you use this functions inside a responsive function, to copy it if the window loads/resizes under 600px, and remove it if it resizes to over 600px again? If i wrap it in this:
$(window).on("load resize",function(e){ if ($(window).width() < 1200) { } });
It keeps firing for each resize.
虽然这完全是另一个问题,但我已经添加了这个解决方案来回复 OP 的评论/问题。以下PLUNKER使用一个媒体查询,额外的样式仅用于演示目的。相关的添加是一个媒体查询和一个规则集:
@media (min-width:600px) {
.content + .content > .item > .copy-this {
display: none;
}
}
原始答案
首先我们收集所有.copy-this
与 .each()
方法:
$('.copy-this').each(function(idx, obj) {
接下来,我们需要区分 2 .content
div 为了指定我们需要从哪个 clone 内容以及将克隆附加到哪个 divs(假设该标准不修改布局),我们可以使用 adjacent sibling selector +
.通过对我们将附加到的目标元素的可靠钩子(Hook),我们将使用 .eq(idx)
同步 .item
从第一个开始.content
, 至 .item
最后的 s .content
.
var target = $('.content + .content > .item').eq(idx);
最后,我们 .clone()
和 .prepend()
.请注意结果,克隆在黑色背景上以黄色文本突出显示。
var clone = $(this).clone(true, true);
target.prepend(clone);
片段
$('.copy-this').each(function(idx, obj) {
var target = $('.content + .content > .item').eq(idx);
var clone = $(this).clone(true, true);
target.prepend(clone);
});
.content + .content > .item > .copy-this {
color: yellow;
background: black;
}
.random-div {
color: brown;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<div class="content">
<div class="item">
<div class="copy-this">Some info 1[#1]</div>
<div class="random-div">Not to copy 1[#1]</div>
</div>
<div class="item">
<div class="copy-this">Some info 2[#1]</div>
</div>
<div class="item">
<div class="copy-this">Some info 3[#1]</div>
<div class="random-div">Not to copy 2[#1]</div>
</div>
<div class="item">
<div class="copy-this">Some info 4[#1]</div>
</div>
</div>
<div class="content">
<div class="item">
</div>
<div class="item">
<div class="random-div">This is original content[#2]</div>
</div>
<div class="item">
</div>
<div class="item">
</div>
</div>
</body>
关于javascript - 如何将div复制/克隆到其他容器中的相应结构,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41132121/
我目前正在尝试基于哈希表构建字典。逻辑是:有一个名为 HashTable 的结构,其中包含以下内容: HashFunc HashFunc; PrintFunc PrintEntry; CompareF
如果我有一个指向结构/对象的指针,并且该结构/对象包含另外两个指向其他对象的指针,并且我想删除“包含这两个指针的对象而不破坏它所持有的指针”——我该怎么做这样做吗? 指向对象 A 的指针(包含指向对象
像这样的代码 package main import "fmt" type Hello struct { ID int Raw string } type World []*Hell
我有一个采用以下格式的 CSV: Module, Topic, Sub-topic 它需要能够导入到具有以下格式的 MySQL 数据库中: CREATE TABLE `modules` ( `id
通常我使用类似的东西 copy((uint8_t*)&POD, (uint8_t*)(&POD + 1 ), back_inserter(rawData)); copy((uint8_t*)&PODV
错误 : 联合只能在具有兼容列类型的表上执行。 结构(层:字符串,skyward_number:字符串,skyward_points:字符串)<> 结构(skyward_number:字符串,层:字符
我有一个指向结构的指针数组,我正在尝试使用它们进行 while 循环。我对如何准确初始化它并不完全有信心,但我一直这样做: Entry *newEntry = malloc(sizeof(Entry)
我正在学习 C,我的问题可能很愚蠢,但我很困惑。在这样的函数中: int afunction(somevariables) { if (someconditions)
我现在正在做一项编程作业,我并没有真正完全掌握链接,因为我们还没有涉及它。但是我觉得我需要它来做我想做的事情,因为数组还不够 我创建了一个结构,如下 struct node { float coef;
给定以下代码片段: #include #include #define MAX_SIZE 15 typedef struct{ int touchdowns; int intercepti
struct contact list[3]; int checknullarray() { for(int x=0;x<10;x++) { if(strlen(con
这个问题在这里已经有了答案: 关闭 11 年前。 Possible Duplicate: Empty “for” loop in Facebook ajax what does AJAX call
我刚刚在反射器中浏览了一个文件,并在结构构造函数中看到了这个: this = new Binder.SyntaxNodeOrToken(); 我以前从未见过该术语。有人能解释一下这个赋值在 C# 中的
我经常使用字符串常量,例如: DICT_KEY1 = 'DICT_KEY1' DICT_KEY2 = 'DICT_KEY2' ... 很多时候我不介意实际的文字是什么,只要它们是独一无二的并且对人类读
我是 C 的新手,我不明白为什么下面的代码不起作用: typedef struct{ uint8_t a; uint8_t* b; } test_struct; test_struct
您能否制作一个行为类似于内置类之一的结构,您可以在其中直接分配值而无需调用属性? 前任: RoundedDouble count; count = 5; 而不是使用 RoundedDouble cou
这是我的代码: #include typedef struct { const char *description; float value; int age; } swag
在创建嵌套列表时,我认为 R 具有对列表元素有用的命名结构。我有一个列表列表,并希望应用包含在任何列表中的每个向量的函数。 lapply这样做但随后剥离了列表的命名结构。我该怎么办 lapply嵌套列
我正在做一个用于学习目的的个人组织者,我从来没有使用过 XML,所以我不确定我的解决方案是否是最好的。这是我附带的 XML 文件的基本结构:
我是新来的 nosql概念,所以当我开始学习时 PouchDB ,我找到了这个转换表。我的困惑是,如何PouchDB如果可以说我有多个表,是否意味着我需要创建多个数据库?因为根据我在 pouchdb
我是一名优秀的程序员,十分优秀!