[英]How to append div using $(this) selector in Jquery?
我有两个在运行时动态创建的div标记。 该标记类名称为MainFolder
<div class="MainFolder" style="padding-left: 20px; width: 200px; height: 23px;">
<span class="glyphicon glyphicon-folder-close folder-icon"></span>Folder1<br>
</div>
<div class="MainFolder" style="padding-left: 20px; width: 200px; height: 23px;">
<span class="glyphicon glyphicon-folder-close folder-icon"></span>Folder2<br>
</div>
jQuery中的单击功能
$(document).on('click', '.MainFolder', function () {
$('<div id="outer">Outer Div Content<div id="inner">Inner Div Content</div></div>').appendTo($(this).parent());
//$('<div id="outer">Outer Div Content<div id="inner">Inner Div Content</div></div>').appendTo($(this));
//$(this).appendTo('<div id="outer">Outer Div Content<div id="inner">Inner Div Content</div></div>');
});
我想在所选元素下创建div标签。
我正在尝试在用户点击的div标签之一下制作div元素
如果我尝试下面的代码。 它是在两个文件夹上创建的。 但是当我使用$(this)时,它不起作用
$('<div id="outer">Outer Div Content<div id="inner">Inner Div Content</div></div>').appendTo('.MainFolder');
您需要附加到$(this)
而不是单击的MainFolder
的父元素
$('<div id="outer">Outer Div Content<div id="inner">Inner Div Content</div></div>').appendTo($(this));
另外,从MainFolder
删除height
样式
演示
$(document).on('click', '.MainFolder', function() { $('<div id="outer">Outer Div Content<div id="inner">Inner Div Content</div></div>').appendTo($(this)); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="MainFolder" style="padding-left: 20px; width: 200px;"> <span class="glyphicon glyphicon-folder-close folder-icon"></span>Folder1<br> </div> <div class="MainFolder" style="padding-left: 20px; width: 200px;"> <span class="glyphicon glyphicon-folder-close folder-icon"></span>Folder2<br> </div>
编辑
看起来您在点击后就进行了ajax调用,因此请保存对$(this)
的引用
$(document).on('click', '.MainFolder', function() {
var $self = $(this);
$('<div id="outer">Outer Div Content<div id="inner">Inner Div Content</div></div>').appendTo($self);
});
已经检查了jsfiddle。 有用。
$('body').on('click', '.MainFolder', function(){
var html = '<div id="outer">Outer Div Content<div id="inner">'+
'Inner Div Content</div></div>';
var self = $(this);
self.parent().append(html);
})
变更自
$('<div id="outer">Outer Div Content<div id="inner">Inner Div Content</div></div>').appendTo($(this).parent());
至
$('<div id="outer">Outer Div Content<div id="inner">Inner Div Content</div></div>').appendTo($(this));
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.