Question

我试图弄清楚为什么我不能删除我的div及其内容，尽管在我的jQuery中正确定位div。因此，我想知道.remove()是否是删除选择的正确方法，或者是否有更好的方法可供使用。

＆＃13;

var startDateField = '<div class="form-inline data-date-wrapper"><label for="data-start-range">Data Date Start:</label><input type="date" name="dataDateStart"></div>';
var endDateField = '<div class="form-inline data-date-wrapper"><label for="data-end-range">Data Date End:</label><input type="date" name="dataDateEnd"></div>';

if ($('#data-date-start').val() && $('#data-date-end').val()) {
  $("#date-range-add-link").hide();

  $("#date-range-add-link").on('click', function() {
    $("#date-range-add-link").hide();
    $("#date-range-remove-link").show();
    $(".add-remove-date-range").append(startDateField);
    $(".add-remove-date-range").append(endDateField);
    console.log(startDateField);
    console.log(endDateField);
  });

  $("#date-range-remove-link").on('click', function() {
    $("#date-range-add-link").show();
    $("#date-range-remove-link").hide();
    $(".form-inline data-date-wrapper").remove();
    $(".form-inline data-date-wrapper").remove();
  });

} else {
  $("#date-range-remove-link").hide();

  $("#date-range-add-link").on('click', function() {
    $("#date-range-add-link").hide();
    $("#date-range-remove-link").show();
    $(".add-remove-date-range").append(startDateField);
    $(".add-remove-date-range").append(endDateField);
    console.log(startDateField);
    console.log(endDateField);
  });

  $("#date-range-remove-link").on('click', function() {
    $("#date-range-add-link").show();
    $("#date-range-remove-link").hide();
    $(".form-inline data-date-wrapper").remove();
    $(".form-inline data-date-wrapper").remove();
  });
};
});

＆＃13;

<div class="add-remove-date-range">
  <a href="#" id="date-range-add-link">Add Report Date Range</a>
  <a href="#" id="date-range-remove-link">Remove Report Date Range</a>
</div>
<div class="form-inline data-date-wrapper">
  <label for="data-start-range">Data Date Start:</label>
  <input type="date" id="data-date-start" name="dataDateStart" value="{{annotation.dataDateStartSlug}}">
</div>
<div class="form-inline data-date-wrapper">
  <label for="data-end-range">Data Date End:</label>
  <input type="date" id="data-date-end" name="dataDateEnd" value="{{annotation.dataDateEndSlug}}">
</div>

＆＃13;

Answer 1

您正在使用正确的API。请在选择器中进行更改。

$(".form-inline data-date-wrapper").remove();

更改为

$(".form-inline.data-date-wrapper").remove();

选择器中提到的类名是单个元素，因此在提及多个类时应该没有空格，并且每个类必须有一个句点（.<classname1>.<classname2>）。

jQuery无法删除Div

1 个答案: