jquery hide работи само веднъж

имам област, която първоначално е скрита и трябва да се появи/изчезне въз основа на съдържанието на полето.

така че ако потребителят избере плащане с кредитна карта - допълнителните полета се отварят, ако не - изчезват.

проблемът е, че работи само за да ги покаже - не и да ги скрие.

може ли някой да види тук: http://bit.ly/dOCNQQ

Благодаря предварително!

$(function(){ 
    $('#CCinfo').hide();       
    $('#paymethod').change(function(){
    var payme = $(this).val();
    if (payme=='CreditCard') {
            $('#CCinfo').show("slow");
        } else {
            $('#CCinfo').hide();    
        }
    });
});

<tr>
 <td colspan="2" align="right">
  <strong>pay by:</strong><br />
  <input type="radio" name="paymethod" id="paymethod" title="*" class="required" value="CreditCard"/>credit card<br />
  <tr>
   <td colspan="2" align="right"><strong>pay by:</strong><br />
    <input type="radio" name="paymethod" id="paymethod" title="*" class="required" value="CreditCard"/>credit card<br />&nbsp;
    <input type="radio" name="paymethod" id="paymethod" title="*" class="required" value="Check"/>cash<br />&nbsp;
    <input type="radio" name="paymethod" id="paymethod" title="*" class="required" value="At Dinner"/>check
   </td>
  </tr>
  &nbsp;
  <input type="radio" name="paymethod" id="paymethod" title="*" class="required" value="Check"/>cash<br />&nbsp;
  <input type="radio" name="paymethod" id="paymethod" title="*" class="required" value="At Dinner"/> check
 </td>
</tr>

person kneidels    schedule 07.03.2011    source източник
comment
Съжаляваме, но Stackoverflow не е платформа за отстраняване на грешки при поискване. Ще трябва да извлечете кода, който смятате за грешен, да го публикувате тук и тогава някой ще може да ви помогне. Като публикувате връзка към страница и поискате отстраняване на грешки, вие не допринасяте с нищо за общността, защото въпросът, който сте задали, няма да бъде от полза за никого, освен за вас.   -  person fresskoma    schedule 08.03.2011
comment
Страхотно е, нямам нищо против отстраняването на грешки.   -  person Dimitry    schedule 08.03.2011


Отговори (3)


Във вашия пример множество входове имат един и същ id, "paymethod", който след това използвате, за да слушате за change събитие. В HTML атрибутът id на даден елемент трябва да е уникален, когато извикате $("#paymethod"), той намира само първия вход с този id. Трябва или да премахнете общия атрибут за идентификатор, или да създадете уникални. Трябва да използвате атрибута name, за да намерите радио входовете.

Така че HTML ще бъде нещо подобно:

<td align="right" colspan="2"><strong>pay by:</strong><br>
    <input type="radio" value="CreditCard" class="required" title="*" name="paymethod">credit card<br>&nbsp;
    <input type="radio" value="Check" class="required" title="*" name="paymethod">cash<br>&nbsp;
    <input type="radio" value="At Dinner" class="required" title="*" name="paymethod"> check
</td>

JS за получаване на радио елементите ще бъде:

$("input[name='paymethod']").change(function() { ... });
person Adam Ayres    schedule 07.03.2011

Всичките ви радио бутони имат един и същ идентификатор. Когато изберете $('#paymethod').val(), получавате само стойността на първия бутон за избор. По случайност това винаги е кредитната карта.

Опитвам:

$('input[name="paymethod"]').click(function (e) {
    if (e.target.value == 'CreditCard') {
        $('#CCinfo').show("slow");
    } else {
        $('#CCinfo').stop().hide();
    }
});
person Dimitry    schedule 07.03.2011

Разгледах вашия код. Не можете да имате няколко входни елемента с един и същ идентификатор. Причината, поради която това се случва във вашия код, е, че манипулаторът на кликвания работи само за първия елемент с ID като метод на плащане, а не за другите два. Просто използвайте общ клас за всички тях и обвържете манипулатор на кликвания към този клас.

person Munim    schedule 07.03.2011