recherche

Maison  >  Questions et réponses  >  le corps du texte

javascript - Un événement Click est ajouté à une balise a et je souhaite ajouter un style de classe à la balise a dans les délais

Il y a plusieurs balises a dans une balise span, et les balises a sont implémentées via ajax. Je souhaite ajouter un événement de clic à la balise a, ajouter un style de classe à la balise a lorsqu'il clique et supprimer les styles de classe des autres balises a en même temps

ajax :

1

2

3

4

5

6

7

8

9

10

11

12

<code>$.ajax({type:"post",url:"carbrand/findCarBrandHot",dataType:"json",success:function(data){

                var html="<a class='on' href='' rel='nofollow'>不限</a> ";

                    var listr = "";                       

                    for(var i = 0; i < data.length; i++){               

                            listr+="<a class=''  title=''  onclick='ch()'>"

                                    +data[i].brand_name+" </a>";                                   

                    }

                    html+=listr;

                    $(".clikbr").html(html);

               }

        });

</code>

html :

1

<code><span class="clikbr"></span></code>

javascript :

1

2

3

4

5

6

7

8

9

<code> function ch(){

        //方法能触发

        //添加样式

        $(this).addClass("on");  //这种方法不行   

        $(this).addClass("hoverWidgetactive").siblings().removeClass("hoverWidget active");  //也实现不了,

         

         

    };

</code>

Il semble que les balises ajoutées via ajax ne puissent pas être obtenues. Je ne sais pas comment obtenir les balises

.
PHP中文网PHP中文网2822 Il y a quelques jours941

répondre à tous(2)je répondrai

  • ringa_lee

    ringa_lee2017-06-12 09:26:00

    Utiliser la délégation d'événement

    1

    2

    3

    4

    <code>$('.clikbr').on('click', 'a', function() {

         $(this).addClass("on");   

         $(this).addClass("hoverWidgetactive").siblings().removeClass("hoverWidget active"); 

    });</code>

    répondre
    0
  • 高洛峰

    高洛峰2017-06-12 09:26:00

    //Vous pouvez le changer en ceci

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    16

    17

    18

    19

    <code>$.ajax({type:"post",url:"carbrand/findCarBrandHot",dataType:"json",success:function(data){

                    var html="<a class='on' href='' rel='nofollow'>不限</a> ";

                        var listr = "";                       

                        for(var i = 0; i < data.length; i++){               

                                listr+="<a class=''  title=''  onclick='ch()'>"

                                        +data[i].brand_name+" </a>";                                   

                        }

                        html+=listr;

                        $(".clikbr").html(html);

                        //必須在這裡給<a>標籤綁定事件

                        $(".clikbr a").on("click",function(){

                            $(this).addClass("on"); 

                                                                           

                          

                          

           $(this).addClass("hoverWidgetactive").siblings().removeClass("hoverWidget active");

                        });

                   }

            });</code>

    répondre
    0
  • Annulerrépondre