Как удалить выбранный переключатель при нажатии на элемент на странице с помощью Jquery - PullRequest
Новая
       14

Как удалить выбранный переключатель при нажатии на элемент на странице с помощью Jquery

0 голосов
/ 23 февраля 2010

Хорошо, я застрял здесь на чем-то.

Это страница, над которой я работаю: https://www.passovermeal.org/

У меня есть две радиокнопки с полями для ввода текста, прикрепленными к каждому.

Если выбран второй переключатель, я бы хотел удалить значение из первого текстового поля.

Теперь, если я нажму на область на моей странице, например, div, с идентификатором #products, я бы хотела удалить выбранное состояние второй радиокнопки и поместить выбранное состояние обратно на первую радиокнопку и удалить сумму который был введен во вторую текстовую область.

вот набор переключателей: 

<div id="hiddenOtherAmountArea">
                        <input type="radio" value="9705" id="level_other" name="level_id" style="display:inline; margin-top:5px;" checked="checked" />
                        <!-- TODO: update value -->
                        <input type="text" id="other_amount" size="10" name="other_amount" value="" class="checked" />
                    </div>
                    <div id="otherAmountArea">
                        <input type="radio" value="9721" id="level_other" name="level_id" style="display:inline; margin-top:5px;" />Or enter another amount&nbsp;&nbsp;
                        <!-- TODO: update value -->
                        <input type="text" id="other_amount" size="15" name="other_amount" value="" class="otherChecked" />
                    </div>

1 Ответ

0 голосов
/ 23 февраля 2010

обо всем по порядку. Вы повторно используете идентификаторы. Они должны быть уникальными, чтобы вещи работали правильно. На самом деле у вас есть 2 элемента с именем other_amount и два с именем level_other. Это нет-нет.

РЕДАКТИРОВАТЬ: Как вы сказали, вам нужны повторно используемые идентификаторы. Я добавил классы к элементам (с тем же именем) для ссылки. Не уверен, какой эффект будут иметь повторяющиеся идентификаторы, если таковые имеются. Нечто подобное должно работать иначе (если я понял ваш вопрос). 

<div id="hiddenOtherAmountArea">
     <input type="radio" value="9705" id="level_other" class="level_other" name="level_id" style="display:inline; margin-top:5px;" checked="checked" />
     <!-- TODO: update value -->
     <input type="text" id="other_amount" class="other_amount" size="10" name="other_amount" value="" class="checked" />
</div>
<div id="otherAmountArea">
     <input type="radio" value="9721" id="level_other" class="level_other" name="level_id" style="display:inline; margin-top:5px;" />Or enter another amount&nbsp;&nbsp;
     <!-- TODO: update value -->
     <input type="text" id="other_amount" class="other_amount" size="15" name="other_amount" value="" class="otherChecked" />
</div>

Вы должны быть в состоянии сделать что-то вроде этого: 

$('#hiddenOtherAmountArea .level_other').change(function() {
    $('#otherAmountArea .other_amount').val('');
});

$('#otherAmountArea .level_other').change(function() {
    $('#hiddenOtherAmountArea .other_amount').val('');
});

$('#products').click(function() {
    $('#hiddenOtherAmountArea .level_other').attr('checked','checked');
    $('#otherAmountArea .other_amount').val('');
})
...