Я хочу получить конкретный родительский узел элемента, использующего jQuery, но по какой-то причине он не работает

Question

У меня есть диапазон внутри тега легенды, который я хочу использовать для удаления тега fieldset при нажатии.Я использую jQuery, и это код, который я не могу заставить работать (да, я использую последнюю версию jQuery)

jQuery:

function removeStep(){
        $(this).closest("fieldset").remove();
        //Already tried: $(this).parents("fieldset").remove(); . . . didn't work
}

HTML:

<div id="steps">
       <fieldset class="step">
              <legend>STEP 1: <span class="remove" onclick="removeStep();">remove</span></legend>                           
       </fieldset>
</div>

Answer 1

Проблема в том, что "this" в вашей функции не будет тем, чем вы хотите.

Так как вы все равно используете jQuery, вы должны избавиться от привычки привязывать обработчики событий напрямую через HTML-разметку. Вместо этого установите обработчик с помощью jQuery:

$(function() {
  $('span.remove').click(removeStep);
});

Если вам абсолютно необходимо сделать это в HTML, попробуйте следующее:

... <span class='remove' onclick='removeStep.call(this);'>remove</span>

Answer 2

работает, передавая ссылку на диапазон напрямую:

JQuery:

function removeStep(step){
        $(step).closest("fieldset").remove();
}

HTML:

<div id="steps">
       <fieldset class="step">
              <legend>STEP 1: <span class="remove" onclick="removeStep(this);">remove</span></legend>                           
       </fieldset>
</div>

Answer 3

$(this.parentElement.parentElement).remove() должно работать.

$(this).parent().parent().remove() это скорее «путь jQuery»; Я думаю, что старые IE по каким-то глупым причинам использовали parentNode вместо parentElement.