выбор jQuery один класс от многих

Я пытаюсь достигнуть следующей функциональности. В форме у меня есть несколько полей с именем класса .inputField, если одно из этих полей выбрано затем, отделение связалось с тем элементом, должен быть показан на фокусе и скрыт на размытости. Однако, когда я реализую код ниже выбора второго элемента, класс применяется к обоим. Не уверенный, где я иду не так, как надо?!?!?

разметка HTML:

<form class="friendlyForm" name="friendlyForm" id="friendlyForm">
                                            <ul>
                                                <li>
                                                    <label for="testField">Test field</label>
                                                    <input name="testField" value="here" class="inputField" id="testField" />
                                                    <div class="helper" style="display: none;">helper text here</div>
                                                </li>
                                                <li>
                                                    <label for="testField">Test field2</label>
                                                    <input name="testField2" value="here" class="inputField" id="testField2" />
                                                    <div class="helper" style="display: none;">helper text here</div>
                                                </li>
                                            </ul>
                                        </form>

разметка jQuery:

$('.friendlyForm').find('.inputField').each(function(i) {
    $(this).blur();
    $(this).focus(function() {
        //Add the focus class and fadeIn the helper div
        $(this).parent().addClass('focus');
        $(this).parent().parent().find('.helper').fadeIn();
    });
    $(this).blur(function () {
        //Remove the focus class and fadeOut helper div
        $(this).parent().removeClass('focus');
        $(this).parent().parent().find('.helper').fadeOut();
    });
});

Любые указатели здесь значительно ценились бы.

Спасибо

1
задан simnom 26 April 2010 в 09:19
поделиться

1 ответ

Если я правильно понял ваш вопрос, это должно помочь.

$('.friendlyForm .inputField').each(function () {
  $(this).blur().focus(function () {
    $(this).parent().addClass('focus');
    $(this).siblings('.helper').fadeIn();
  }).blur(function () {
    $(this).parent().removeClass('focus');
    $(this).siblings('.helper').fadeOut();
  });
});

Что вы делаете неправильно, так это то, что вы используете parent (). Parent () , который получит тег

    и, таким образом, найдет все ] .helper элементы в этом
      .

2
ответ дан 3 September 2019 в 01:01
поделиться
Другие вопросы по тегам:

Похожие вопросы: