如何使用javascript动态添加类

Question

我想将一个类添加到click对象的最近元素中。

如果您看到以下代码，我想将一个班级添加到.process-signs-direction-cover-button

有一个循环，所以上面的类重复了。但我想在我点击的closest() .process-signs-direction-cover-button添加一个类。

见图片

我的PHP：

                <div class="col-md-6 reduced_padding_col7">
            <?php
                $signs_to_direction_and_cover_process = $mysqli_scs->query("SELECT * FROM agsigns_db3.stock_stk where idstc_stk = ".$row['idstc_stk']." AND directioncolor_stk = 'Yellow' ");
                $row_cnt = $signs_to_direction_and_cover_process->num_rows;



                if($row_cnt > 0){ 

                while ($row = mysqli_fetch_assoc($signs_to_direction_and_cover_process)) { ?>

                    <div class="col-md-4 thumbnail"><img src="../../css/sign-directions/<?php echo $row['directionimage_stk']; ?>" class="processing-signs-direction-cover-sign-direction-selection-process" id="<?php echo $row['id_stk']; ?>" />
                            <div class="col-xs-12 text-center signs-text">
                                <span class="current_stock_figure">
                                        <?php echo $row['stock_stk'] == ""  ? "N/A" : $row['stock_stk']; ?>
                                </span> 
                                    <span class="max_stock_figure">
                                        <?php echo $row['maxlevel_stk']; ?>
                                    </span>
                            </div>
                    </div>


                <?php
                    }
                }
            ?>
        </div>

        <div class="col-md-2 process-button">
                <img src="../../css/buttons/process-signs-covered-disabled.png" id="" class="process-signs-direction-cover-button disabled_button" rel="<?php echo $row['signcode_sgn']; ?>" alt="covered"/>

            <div class="options-remember-checkbox">
                <input type="checkbox" class="rememberoptions" name="rememberoption" value="checked" > Remember Options<br>
            </div>

MY JQuery

$(".processing-signs-direction-cover-sign-direction-selection-process").click(function() {

        $(this).closest("process-button.process-signs-direction-cover-button").toggleClass("process");


     });

修改 问题已修改 Image code

Answer 1

在您的jquery部分中，使用addClass代替toggleClass。

 $(".processing-signs-direction-cover-sign-direction-selection-process").click(function() {
      $(this).closest("process-button.process-signs-direction-cover-button").addClass("process");
 });