我似乎无法让appendTo工作.我做错了什么?
$('div:nth-child(2n) img').appendTo(parent);
Run Code Online (Sandbox Code Playgroud)
当前加价:
<div class="container">
<img src="123.jpg" />
<p>Hey</p>
</div>
<div class="container">
<img src="123.jpg" />
<p>Hey</p>
</div>
Run Code Online (Sandbox Code Playgroud)
我想要这个输出:
<div class="container">
<p>Hey</p>
<img src="123.jpg" />
</div>
<div class="container">
<p>Hey</p>
<img src="123.jpg" />
</div>
Run Code Online (Sandbox Code Playgroud)
请帮帮我们......我每分钟都在撕扯我的头发..: - S
如何使用jQuery append将元素追加到子元素的特定索引,例如,如果我有:
<div class=".container">
<div class="item"><div>
<div class="item"><div>
<div class="item"><div>
<div class="item"><div>
</div>
Run Code Online (Sandbox Code Playgroud)
我想在第二个和第三个项目之间追加另一个项目?
我有一个div像元素
<div id="move">Something</div>
Run Code Online (Sandbox Code Playgroud)
...我想在DOM中从一个位置移动到另一个位置.我可以这样做appendTo(),像这样:
$('#move').fadeOut(500, function() {
$(this).appendTo('#another-container').fadeIn(500);
});
Run Code Online (Sandbox Code Playgroud)
......或者这会复制吗?
如果它是重复的,那么id在DOM 中将有两个相同的元素.我怎么能避免这个?
我使用jQuery ui draggable但选项appendTo不起作用.但是其他选项如遏制或网格正常工作.这是代码:
HTML
<div id="demo">
</div>
<div id="sidebar">
<div class="item">
</div>
<div class="item">
</div>
<div class="item">
</div>
<div class="item">
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
脚本
jQuery(".item").draggable({ appendTo: "#demo", grid: [ 10, 10 ], containment: "#demo" });
Run Code Online (Sandbox Code Playgroud)
CSS
#demo {
width: 500px;
height: 500px;
border: 1px solid black;
float: left;
}
#draggable {
background: red;
width: 50px;
height: 50px;
}
#sidebar {
float: left;
width: 300px;
}
.item {
cursor: pointer;
background: black;
width: 100px;
height: 100px;
margin: 10px;
}
Run Code Online (Sandbox Code Playgroud)
这是一个现场演示:http: …
现在苦苦挣扎了一会儿.我的标记简化了:
<div class=row>
<div class="somediv"></div>
<div class="somediv2"></div>
<div class="elem"></div>
<div class="elem"></div>
<div class="somediv3"></div>
<div class="somediv4"></div>
<div class=row>
....
Run Code Online (Sandbox Code Playgroud)
我需要找到一种方法来选择文档准备好的所有DIV:1.有一个类:elem 2.他们的下一个DIV也有类名:elem.然后我需要在它们之间插入一个新的DIV:
<div class=row>
<div class="somediv2"></div>
<div class="elem"></div>
<div class="new"></div>
<div class="elem"></div>
<div class="somediv3"></div>
<div class="somediv4"></div>
<div class=row> // and it goes...
$(document).ready( function () {
if($('.elem').next().hasClass('.elem')) {
$('<div class="new"></div>').appendTo().prev('.elem');
} else {
});
});
Run Code Online (Sandbox Code Playgroud) 我需要在页面中显示项目列表,并使用AJAX更新此页面.每次将新项目推送到客户端时,我希望它出现在我的内部的随机位置ul list.
这是我正在谈论的那种列表的一个例子:http: //jsfiddle.net/XEK4x/
<ul class="itemlist">
<li>Item #2</li>
<li>Item #2</li>
<li>Item #3</li>
<li>Item #4</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
.itemlist li{
width:100px;
height: 100px;
margin: 8px;
padding: 4px;
float: left;
background: #dddddd;
}
Run Code Online (Sandbox Code Playgroud)
有关如何使用jquery在列表中的随机位置添加新项目的任何想法?我知道我可以做类似的事情,$(li_element).appendTo(".itemlist");但这会将它附加到列表的底部.
可能存在问题的另一个问题是每个li element都浮动到左侧.因此,当在中间添加一个新元素时,该元素之后的所有内容都将向右推一个点.
我可以继续使用several ul lists floated left,li's stacked under each other所以当一个新项目被渲染时,列表只是被推下来,但如果我随机执行此操作,一些ul列表可能比其他列表更长,这看起来也很奇怪.
我正在使用jquery ui对话框实现便签.在一个按钮上单击一个大的全屏ui对话框打开,在该大对话框内是一个添加小对话框(注释)的按钮.
HTML:
<body>
<button id="opener">open the dialog</button>
<div id="outter-dialog" title="Notes">
<button id = "add-note">Add Note</button>
</div>
Run Code Online (Sandbox Code Playgroud)
JS:
$( "#outter-dialog" ).dialog({
autoOpen: false,
title: "Success Message",
width: $(window).width(),
height: $(window).height(),
modal: false,
buttons: {
Cancel: function() {
$(this).dialog('close');
}
}
});
$("#opener").click(function(){
$( "#outter-dialog" ).dialog('open');
});
var prevelement;
$("#add-note").click(function () {
var dynamicDialog = $('<div id="MyDialog"> <textarea>Hello</textarea> </div>');
var pos;
if (prevelement) {
pos = {
my: "left",
at: "bottom",
of: prevelement
}
}
dynamicDialog.dialog({
title: "Note",
modal: false, …Run Code Online (Sandbox Code Playgroud) 我正在使用一些jquery,发现了一个奇怪的jquery .appendTo()函数行为.
在这里查看此代码.
单击第一列的每个项目时,单击的项目将附加到第二列.
如果你点击物品3和4一切工作都按预期:他们会在你点击的顺序被追加.当您单击项目时1,他也将被正确添加.
问题是当你点击项目时2.此项目位于项目内1.
这个项目没有附加到div的末尾,他被附加在他的老父母之上!
看图像:

现在,我期待的与我得到的相比:

如果再次单击项目,2他将附加在div的末尾.
这个行为有一些解释吗?事实上这是一个错误?
我该如何解决这个问题?
Ps:Jquery 1.10.1
appendTo()会在$ .each中导致闪烁....
$.each(jsob.Table, function(i, employee) {
$('<div class="resultsdiv"><br /><span class="resultName">' + employee.Emp_Name + '</span><span class="resultfields" style="padding-left:100px;">Category :</span> <span class="resultfieldvalues">' + employee.Desig_Name + '</span><br /><br /><span id="SalaryBasis" class="resultfields">Salary Basis :</span> <span class="resultfieldvalues">' + employee.SalaryBasis + '</span><span class="resultfields" style="padding-left:25px;">Salary :</span> <span class="resultfieldvalues">' + employee.FixedSalary + '</span><span style="font-size:110%;font-weight:bolder;padding-left:25px;">Address :</span> <span class="resultfieldvalues">' + employee.Address + '</span></div>').appendTo('#ResultsDiv');
});
Run Code Online (Sandbox Code Playgroud)
现在我将每个新div添加到#ResultsDiv内部$.each是好/坏这样做...如果它是坏的什么可以做我的divs appendTo()循环后让我不会闪烁....
编辑:(根据答案)
var divs = '';
$.each(jsob.Table, function(i, employee) {
divs += '<div class="resultsdiv"><br /><span class="resultName">' + employee.Emp_Name + '</span><span class="resultfields" style="padding-left:100px;">Category :</span> <span class="resultfieldvalues">' + employee.Desig_Name + '</span><br /><br …Run Code Online (Sandbox Code Playgroud) 我已经在这里找不到了,希望有人能提供帮助。
我需要将链接(.more)附加到其前面的段落中-我确定这很简单,但不能完全正确:
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<a href="#" class="more">Read more</a>
<p>Lorem ipsum</p>
Run Code Online (Sandbox Code Playgroud)
最终的HTML中可能有更多的段落,我需要这样做的原因与CMS有关。但是基于以上内容,我的目标是:
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum <a href="#" class="more">Read more</a></p>
<p>Lorem ipsum</p>
Run Code Online (Sandbox Code Playgroud)
我试过了:
$(".more").appendTo("p");
Run Code Online (Sandbox Code Playgroud)
但这显然会附加到所有段落中……也许这是prevAll的工作,但我不能完全同意。
在此先感谢您的帮助!