Question

我有一个动态创建的div。创建了多个，我需要做一个自我隐藏，所以这就是我所做的：

这个Div：

<div><a href="">'+inputText+'-</a><div class="box"></div><span onclick="dismiss();">Close</span></div>

功能：

function dismiss() {
    $(this).parents('div').fadeOut();
}

当我点击近距离时，它并没有隐藏。

Answer 1

内部dismiss函数this引用窗口对象，而不是将this作为参数传递。

function dismiss(ele) {
  $(ele).parents('div').fadeOut();
  console.log(this);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div><a href="">'+inputText+'-</a>
  <div class="box"></div><span onclick="dismiss.bind(this);dismiss(this);">Close</span>
</div>

Answer 2

您无法直接访问$(this)任何功能：

所以：将此作为参数传递：

<span onclick="dismiss(this);">Close</span>

function dismiss(obj) {
    $(obj).parents('div').fadeOut();
}

Answer 3

请考虑使用按钮，而不是使用跨度。这在语义上是合适的。甚至可能更改＆lt; div＆gt;到＆lt; p＆gt; （取决于它是否是段落）。请记住，你不能在p里面有一个div，所以你需要将.box div更改为span。

<div>
    <a href="">'+inputText+'-</a>
    <div class="box"></div>
    <button onclick="dismiss(this);">Close</button>
</div>

对于JS：

function dismiss(obj) {
$(obj).parents('div').fadeOut();
return false;
}

Answer 4

另一种方法，更改html

<div>
  <a href="">Click</a>
  <div class="box"></div>
  <span id="btn">Close</span>
</div>

和JS

$(document).on('click','#btn', function(){
  $(this).parents('div').hide();
});

Fiddle

当点击跨度时，Javascript自我隐藏父div不隐藏

4 个答案: