2016-05-10 2 views
-1

У меня есть 3 окна с тем же именем, если я нажму .fonarcom jquery hide all .pagamento`.удалить только родительский элемент jquery

Есть ли способ скрыть только .pagamento в родительском контейнере?

var j = jQuery.noConflict(); 

j(".fonarcom").click(function() { 
    if (j(this).is(':checked')) { 
     j(".pagamento").hide(); 
    } else { 
     j(".pagamento").show(); 
    }; 
}); 

HTML:

<div class="large-6 columns "> 
    <label><input name="fonarcom" class="fonarcom" type="checkbox" value="SI"> L'azienda aderisce a FonarCom</label> 
</div> 


<div class="large-6 columns pagamento"> 
    <label>Modalità di pagamento</label> 
    <select name="pagamento" required> 
    <option value="">Seleziona un metodo di pagamento</option> 
    <option value="Contanti/Assegno Inizio Corso">Contanti/Assegno Inizio Corso</option> 
    <option value="Bonifico Anticipato">Bonifico Anticipato</option> 
    </select> 
</div> 
+1

post html please –

+0

HTML, который вы опубликовали, не дает никаких намеков на то, что 'pagament' вы хотите скрыть и что хотите показать. – callback

+0

Если div с классом pagamento - это только один элемент, то скрытие его скроет/покажет его для всех входов. Из вашего образца кода он представляется только одним элементом. Да? – klabranche

ответ

1

первую очередь вам нужно родительский контейнер, поэтому я сделал Div обертку (но я полагаю, у вас уже есть)

<div class="wrapper"> 
    <div class="large-6 columns "> 
     <label><input name="fonarcom" class="fonarcom" type="checkbox" value="SI"> L'azienda aderisce a FonarCom</label> 
    </div> 

    <div class="large-6 columns pagamento"> 
     <label>Modalità di pagamento</label> 
     <select name="pagamento" required> 
     <option value="">Seleziona un metodo di pagamento</option> 
     <option value="Contanti/Assegno Inizio Corso">Contanti/Assegno Inizio Corso</option> 
     <option value="Bonifico Anticipato">Bonifico Anticipato</option> 
     </select> 
    </div> 
</div> 
<div class="wrapper"> 
     <div class="large-6 columns "> 
      ... 

затем в JQuery просто выберите контейнер и найти правильный .pagamento

if(j(this).is(':checked')) { 
    j(this).closest(".wrapper").find(".pagamento").hide(); 
} else { 
    j(this).closest(".wrapper").find(".pagamento").show(); 
}; 

Смотрите рабочий пример здесь: FIDDLE

0

Как pagamento является родственным родительским элементом divfonarcom «s. Вы можете использовать closest() для перемещения до div, затем используйте .next(), чтобы найти ближайшего родственника.

var j = jQuery.noConflict(); 

j(".fonarcom").click(function() { 
    j(this).closest('div').next(".pagamento").toggle(this.checked); 
}); 

Здесь, я использовать .toggle(display)

Используйте true, чтобы показать элемент или false, чтобы скрыть его.

Смежные вопросы