Параметризация функции JQuery, чтобы сделать ее динамичной

Question

Мне нужно сделать функцию jQuery динамической (параметризованной). В настоящее время мне нужно связать каждый идентификатор формы с помощью jquery, но у меня более ста идентификаторов форм, поэтому повторение кода будет бессмысленным только для одного и того же кода, но с другим идентификатором.

Например:

Ниже приведена форма. Его идентификатор "крыса"

            <form id="rat" action="" method="post">

                <strong id="rating_title">Rate this: </strong>

                <select name="rate">
                    <?php foreach (get_options() as $id => $title): ?>
                        <option value="<?php echo $id ?>" <?php echo $id==3 ? 'selected="selected"' : '' ?> /><?php echo $title ?></option>
                    <?php endforeach; ?>
                </select>

                <input type="submit" value="Rate it!" />

            </form>

Ниже javascript прилагается эта форма

<script type="text/javascript">
    $(function(){
        $("#rat").children().not("select, #rating_title").hide();

        // Create caption element
        var $caption = $('<div id="caption"/>');

        // Create stars
        $("#rat").stars({
            inputType: "select",
            oneVoteOnly: true,
            captionEl: $caption,
            callback: function(ui, type, value)
            {
                // Display message to the user at the begining of request
                $("#messages").text("Saving...").fadeIn(30);

                // Send request to the server using POST method
                /* NOTE: 
                    The same PHP script is used for the FORM submission when Javascript is not available.
                    The only difference in script execution is the returned value. 
                    For AJAX call we expect an JSON object to be returned. 
                    The JSON object contains additional data we can use to update other elements on the page.
                    To distinguish the AJAX request in PHP script, check if the $_SERVER['HTTP_X_REQUESTED_WITH'] header variable is set.
                    (see: demo4.php)
                */ 
                $.post("demo4.php", {rate: value}, function(json)
                {
                    // Change widget's title
                    $("#rating_title").text("Average rating");

                    // Select stars from "Average rating" control to match the returned average rating value
                    ui.select(Math.round(json.avg));

                    // Update widget's caption
                    $caption.text(" (" + json.votes + " votes; " + json.avg + ")");

                    // Display confirmation message to the user
                    $("#messages").text("Rating saved (" + value + "). Thanks!").stop().css("opacity", 1).fadeIn(30);

                    // Hide confirmation message after 2 sec...
                    setTimeout(function(){
                        $("#messages").fadeOut(1000)
                    }, 2000);

                }, "json");
            }
        });

        // Since the <option value="3"> was selected by default, we must remove this selection from Stars.
        $("#rat").stars("selectID", -1);

        // Append caption element !after! the Stars
        $caption.appendTo("#rat");

        // Create element to use for confirmation messages
        $('<div id="messages"/>').appendTo("#rat");
    });
</script>

Как вы можете видеть его привязку к "крысиной" форме, используя $ ("# rat").

Таким же образом у меня есть около 100 форм с разными идентификаторами, и мне нужно связать каждую из форм одинаковым образом ... за исключением изменений в нескольких параметрах. Например: если id формы - "rat2", то $ ("# rat2") ... $ ("# messages") ... и т. Д.

Есть ли способ, которым я могу инкапсулировать весь вышеуказанный код javascript / jquery, чтобы сделать его параметризованным.

Пожалуйста, помогите !!!

Answer 1

Имеет ли смысл добавлять класс к каждой форме «рейтинга» и просто применять свой код к каждой форме с этим классом?

<form class="rating" id="???">
  ...
</form>

Затем добавьте свой jQuery:

<script>
    $(function(){
        $('form.rating').each(function(){
            //apply logic to each form (extract id's from "this" form as needed)
        });
    });
</script>