Jquery Radyo düğmesi işaretliyse

Olası Çoğaltma:
Belirli radyo düğmesinin kontrolü işaretlenir

Şu anda bu 2 radyo düğmesi var, böylece kullanıcı fiyata dahil posta gerek olup olmadığına karar verebilir:

<input type="radio" id="postageyes" name="postage" value="Yes" /> Yes
<input type="radio" id="postageno" name="postage" value="No" /> No

'Evet' radyo düğmesinin işaretli olup olmadığını kontrol etmek için Jquery kullanmam gerekiyor ve eğer varsa, bir ekleme işlevi yapın. Birisi bana bunu nasıl yapacağımı söyleyebilir mi lütfen?

Herhangi bir yardım için teşekkürler

Düzenle:

Kodumu bu şekilde güncelledim, ancak çalışmıyor. Yanlış bir şey mi yapıyorum?

<script type='text/javascript'>
// <![CDATA[
jQuery(document).ready(function(){

$('input:radio[name="postage"]').change(function(){
    if($(this).val() == 'Yes'){
       alert("test");
    }
});

});

// ]]>
</script>

$('input:radio[name="postage"]').change(
    function(){
        if ($(this).is(':checked') && $(this).val() == 'Yes') {
            // append goes here
        }
    });

Veya, yukarıdaki - tekrar - biraz daha az gereksiz jQuery kullanarak :

$('input:radio[name="postage"]').change(
    function(){
        if (this.checked && this.value == 'Yes') {
            // note that, as per comments, the 'changed'
            // <input> will *always* be checked, as the change
            // event only fires on checking an <input>, not
            // on un-checking it.
            // append goes here
        }
    });

Gözden geçirilmiş (bazı geliştirilmiş) jQuery:

// defines a div element with the text "You're appendin'!"
// assigns that div to the variable 'appended'
var appended = $('<div />').text("You're appendin'!");

// assigns the 'id' of "appended" to the 'appended' element
appended.id = 'appended';

// 1. selects '<input type="radio" />' elements with the 'name' attribute of 'postage'
// 2. assigns the onChange/onchange event handler
$('input:radio[name="postage"]').change(
    function(){

        // checks that the clicked radio button is the one of value 'Yes'
        // the value of the element is the one that's checked (as noted by @shef in comments)
        if ($(this).val() == 'Yes') {

            // appends the 'appended' element to the 'body' tag
            $(appended).appendTo('body');
        }
        else {

            // if it's the 'No' button removes the 'appended' element.
            $(appended).remove();
        }
    });

var appended = $('<div />').text("You're appendin'!");
appended.id = 'appended';
$('input:radio[name="postage"]').change(function() {
  if ($(this).val() == 'Yes') {
    $(appended).appendTo('body');
  } else {
    $(appended).remove();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<input type="radio" id="postageyes" name="postage" value="Yes" />Yes
<input type="radio" id="postageno" name="postage" value="No" />No

JS Fiddle demosu .

Ve ayrıca, hafif bir güncelleme (snippet'leri ve JS Fiddle bağlantılarını içerecek şekilde düzenlediğimden beri), <input />öğeleri <label>s ile sarmak için - ilgili metni güncellemek için metnin tıklanmasına izin ver <input />- ve oluşturma araçlarını değiştir eklenecek içerik:

var appended = $('<div />', {
  'id': 'appended',
  'text': 'Appended content'
});
$('input:radio[name="postage"]').change(function() {
  if ($(this).val() == 'Yes') {
    $(appended).appendTo('body');
  } else {
    $(appended).remove();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>
  <input type="radio" id="postageyes" name="postage" value="Yes" />Yes</label>
<label>
  <input type="radio" id="postageno" name="postage" value="No" />No</label>

JS Fiddle demosu .

Ayrıca, yalnızca kullanıcı tarafından hangi öğenin denetlendiğine bağlı olarak içerik göstermeniz gerekiyorsa, açık bir show / hide kullanarak görünürlüğü değiştirecek küçük bir güncelleme:

// caching a reference to the dependant/conditional content:
var conditionalContent = $('#conditional'),
    // caching a reference to the group of inputs, since we're using that
    // same group twice:
    group = $('input[type=radio][name=postage]');

// binding the change event-handler:
group.change(function() {
  // toggling the visibility of the conditionalContent, which will
  // be shown if the assessment returns true and hidden otherwise:
  conditionalContent.toggle(group.filter(':checked').val() === 'Yes');
  // triggering the change event on the group, to appropriately show/hide
  // the conditionalContent on page-load/DOM-ready:
}).change();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>
  <input type="radio" id="postageyes" name="postage" value="Yes" />Yes</label>
<label>
  <input type="radio" id="postageno" name="postage" value="No" />No</label>
<div id="conditional">
  <p>This should only show when the 'Yes' radio &lt;input&gt; element is checked.</p>
</div>

Ve son olarak, sadece CSS kullanarak:

/* setting the default of the conditionally-displayed content
to hidden: */
#conditional {
  display: none;
}

/* if the #postageyes element is checked then the general sibling of
that element, with the id of 'conditional', will be shown: */
#postageyes:checked ~ #conditional {
  display: block;
}

<!-- note that the <input> elements are now not wrapped in the <label> elements,
in order that the #conditional element is a (subsequent) sibling of the radio
<input> elements: -->
<input type="radio" id="postageyes" name="postage" value="Yes" />
<label for="postageyes">Yes</label>
<input type="radio" id="postageno" name="postage" value="No" />
<label for="postageno">No</label>
<div id="conditional">
  <p>This should only show when the 'Yes' radio &lt;input&gt; element is checked.</p>
</div>

JS Fiddle demosu .

Referanslar:

• CSS:
  • :checkedseçici .
  • CSS Özellik seçicileri.
  • Genel kardeş ( ~) birleştirici .
• jQuery:
  • appendTo().
  • öznitelik eşittir seçici .
  • change().
  • :checkedseçici .
  • filter().
  • is().
  • :radioseçici .
  • remove().
  • text().
  • toggle().
  • val().

Bunu dene

if($("input:radio[name=postage]").is(":checked")){
  //Code to append goes here
}

Bunun gibi bir şey:

if($('#postageyes').is(':checked')) {
// do stuff
}

$('input:radio[name="postage"]').change(function(){
    if($(this).val() === 'Yes'){
       // append stuff
    }
});

Bu, radyo düğmelerinde bir değişiklik olayı dinler. Kullanıcı tıkladığında Yesetkinlik tetiklenir ve DOM'a istediğiniz her şeyi ekleyebilirsiniz.

if($('#test2').is(':checked')) {
    $(this).append('stuff');
} 

$("input").bind('click', function(e){
   if ($(this).val() == 'Yes') {
        $("body").append('whatever');
   }
});

Bunu dene:

if ( jQuery('#postageyes').is(':checked') ){ ... }

jQuery('input[name="inputName"]:checked').val()

Bu, değişen etkinliği dinleyecektir. Başkalarının cevaplarını denedim ama bunlar benim için işe yaramadı ve sonunda bu işe yaradı.

$('input:radio[name="postage"]').change(function(){
    if($(this).is(":checked")){
        alert("lksdahflk");
    }
});