Mithilfe von jQuery zu Wählen Sie Verborgen, Radio-Buttons, aber onclick nicht Funktioniert

Bin ich mit Hilfe von jQuery zum ausblenden der tatsächlichen radio-buttons auf meiner website und ersetzen Sie Sie mit Bildern (custom radio-buttons). Die jQuery ermöglicht es dem Benutzer, klicken Sie auf das Bild, das wiederum "wählt" das versteckte radio-button. Das eigentliche radio-buttons onclick-Ereignisse mit Ihnen verbunden in den html-code, aber wenn ich auf "wählen" radio-button über dem Bild (jQuery), das eigentliche radio-button scheint nicht zu erkennen, die Auswahl und damit das onclick-Ereignis wird NICHT aktiviert.

Kann ich bestätigen, dass das onclick-event-script funktioniert bei Verwendung des Standard-radio-buttons (ohne jQuery); es funktioniert einfach nicht, wenn ich jQuery verwenden für custom radio-buttons. Hier ist mein code bisher:

HTML-Code

<div class="prettyRadiobuttons clearfix">
<ul id="store">

<li><input name="store" type="radio" id="store_1" value="store_1" onclick="dynamic_Select('code.php', this.value)" />
<label for="store_1">Store 1</label></li>

<li><input name="store" type="radio" id="store_2" value="store_2" onclick="dynamic_Select('code.php', this.value)" />
<label for="store_2">Store 2</label></li>

</ul>
</div>

jQuery (für benutzerdefinierte radio-buttons)

$(document).ready(function() {
        //Adds the "radiolist" class to the div containing the radio buttons
        $("div.prettyRadiobuttons").addClass("radiolist");

        //Adds the html for the custom radio button (image) to each radio button (li)
        $("div.radiolist li").append('<a class="radio-select" href="#">Select</a><a class="radio-deselect" href="#">Cancel</a>');

        //Handles selecting a radio button
        $(".radiolist .radio-select").click(
            function(event) {
                event.preventDefault();
                var $boxes = $(this).parent().parent().children();
                $boxes.removeClass("selected");
                $(this).parent().addClass("selected");
                $(this).parent().find(":radio").attr("checked","checked");
            }
        );

        //Handles de-selecting a radio button
        $(".radiolist .radio-deselect").click(
            function(event) {
                event.preventDefault();
                $(this).parent().removeClass("selected");
                $(this).parent().find(":radio").removeAttr("checked");
            }
        );
    });

Den verschiedenen Klassen in der jQuery verwendet werden, weisen unterschiedliche Bilder per CSS basierend auf, ob oder nicht Sie den radio-button ausgewählt ist.

Den jQuery-code funktioniert ohne onclick-Ereignisse vorhanden sind, und die onclick-events arbeiten, ohne die Verwendung von jQuery, aber ich kann nicht mit Ihnen beiden zusammen zu arbeiten. Jede Hilfe wäre sehr geschätzt werden!

InformationsquelleAutor Stone | 2012-01-05
Schreibe einen Kommentar