Klickereignis eines Optionsfelds in jquery auswählen und auslösen

Beim Laden des Dokuments versuche ich, das Klickereignis des ersten Optionsfelds auszulösen … aber das Klickereignis ist not triggered.Auch versucht ‘ändern’ statt zu klicken … aber es ist das gleiche Ergebnis.

$(document).ready(function() {
    //$("#checkbox_div input:radio").click(function() {

    $("input:radio:first").prop("checked", true).trigger("click");

    //});



    $("#checkbox_div input:radio").click(function() {

      alert("clicked");

    });

});

Bitte folgen Sie dem unten stehenden Link zur Frage

Beispiel:
http://jsbin.com/ezesaw/1/edit

Bitte helfen Sie mir dabei, dies richtig zu machen. Vielen Dank!

Sie lösen das Ereignis aus bevor das Ereignis überhaupt gebunden ist.

Einfach verschieben triggering des Ereignisses bis nach dem Anhängen des Ereignisses.

$(document).ready(function() {
  $("#checkbox_div input:radio").click(function() {

    alert("clicked");

   });

  $("input:radio:first").prop("checked", true).trigger("click");

});

Überprüfen Sie Geige

Ändern Sie die Reihenfolge des Codes: Sie rufen das Click-Ereignis auf, bevor es angehängt wird.

$(document).ready(function() {
      $("#checkbox_div input:radio").click(function() {

           alert("clicked");

      });

      $("input:radio:first").prop("checked", true).trigger("click");

});

Meine Lösung ist etwas anders:

$( 'input[name="your_radio_input_name"]:radio:first' ).click();

$("#radio1").attr('checked', true).trigger('click');

In meinem Fall musste ich Bilder beim Klicken auf das Optionsfeld laden, ich verwende nur die regulären onclick Ereignis und es hat bei mir funktioniert.

 <input type="radio" name="colors" value="{{color.id}}" id="{{color.id}}-option" class="color_radion"  onclick="return get_images(this, {{color.id}})">

<script>
  function get_images(obj, color){
    console.log($("input[type="radio"][name="colors"]:checked").val());

  }
  </script>