Question

我正在尝试使用jquery

清空下一个div html数据

$('#deleteAssocPesident').click(function(e){
  // e.preventDefault();
  console.log(e);

  $(this).next('div').next('#deletePresidentBlock').html('');
});

HTML

<div class="user_president_designation" id="user_designation_president">President <i class="fa fa-trash-o" aria-hidden="true" id="deleteAssocPesident" style="float: right;font-size: 22px;margin-top: 4px;" ></i></div>
<div class="user_president_block" id="deletePresidentBlock">
  <img src="" style="max-width: 300px;max-height: 300px;min-height: 300px;" class="img img-responsive" />
  <div class="user_president_name">{{$firstName}}&nbsp;{{$lastName}}</div>
  <input type="hidden" value="" name="president">
</div>

我尝试了很多方法，但它不起作用。我相信这个功能正在运行它可能是下一个无法找到div的问题任何帮助都是适当的

更新

我有很多类似的块，所以我不能使用id。所以我有空的最近删除div块

现在我添加了类名deletePresidentBlock，因为id应该是unque

Answer 1

您可以使用解决方案

$('#deleteAssocPesident').click(function(e){
  $(this).closest('div#user_designation_president').next('#deletePresidentBlock').html('');
});

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="user_president_designation" id="user_designation_president">President   <i class="fa fa-trash-o" aria-hidden="true" id="deleteAssocPesident" style="float: right;font-size: 22px;margin-top: 4px;" ></i>
</div>
<div class="user_president_block" id="deletePresidentBlock">
  <img src="" style="max-width: 300px;max-height: 300px;min-height: 300px;" class="img img-responsive" />
  <div class="user_president_name">{{$firstName}}&nbsp;{{$lastName}}</div>
  <input type="hidden" value="" name="president">
</div>

希望这会对你有所帮助。

Answer 2

试试这个：

$('#deleteAssocPesident').click(function(e) {
    $(this).parent().siblings('div#deletePresidentBlock:first').html('');
});

Answer 3

$('#deleteAssocPesident').click(function(e){
  // e.preventDefault();
  console.log(e);

  //$('#deletePresidentBlock').html('');
  $(this).parent().next('div').children('#deletePresidentBlock').html('');
});

如何用jQuery删除下一个元素的内容？

3 个答案: