Ajouter et supprimer un attribut avec jquery

C'est mes boutons:

<button id="add">Add</button>
<button id="remove">Remove</button>

c'est mon code JavaScript:

<script type="text/javascript">
    $(document).ready(function(){   
        /*** Add attribute ***/
        $("#add").click(function(){
            $("#page_navigation1").attr("id","page_navigation1");
        });     
        /*** Remove attribute ***/
        $("#remove").click(function(){
            $("#page_navigation1").removeAttr("id");
        });     
    });
</script>

et c'est mon code html:

<div id="page_navigation1">next</div>

Mon problème est que quand je clique sur le bouton Supprimer tout est beau et ID sera supprimé,
mais après cliquez sur le bouton supprimer, quand je clique sur le bouton Ajouter, le code ne fonctionne pas et rien ne se passe!

Je besoin d'ajouter et de supprimer l'ID avec ce code, mais je peux juste Supprimer l'ID, je ne peux pas ajouter ID. J'ai besoin d'aide pour cela, et encore une chose,

Comment je peux ajouter un style CSS pour le bouton lorsque le bouton est Actif?
comme ça, quand je clique sur le bouton Supprimer, je veux changer d'arrière-plan du bouton rouge. J'ai besoin d'ajouter classe css pour ajouter et supprimer lorsque les boutons sont actifs! et je ne sais pas comment!

IIRC, la modification de l'id n'est pas possible, sauf si l'élément est créé à nouveau.
Vous pouvez définir la id attribut... mais vous êtes un réglage à l'élément avec l'id "ajouter".. si vous n'avez pas d'élément avec l'id "ajouter" vous ne pouvez pas modifier ses attributs. Vous avez besoin de la référence à l'élément.
u pourrait expliquer plus? je ne sais pas ce r u disant 🙁 et comment au sujet de style css pour les boutons lorsqu'ils sont actifs?

InformationsquelleAutor Alireza | 2012-07-15

attributes jquery

80

C'est parce que vous avez enlevé la id qui est de savoir comment vous avez trouver l'élément. Cette ligne de code est d'essayer d'ajouter id="page_navigation1" à un élément avec le id nommé page_navigation1, mais il n'existe pas (parce que vous avez supprimé l'attribut):
```
$("#page_navigation1").attr("id","page_navigation1");
```
Démo:

Si vous voulez ajouter et supprimer une classe qui rend votre <div> rouge utilisation:
```
$( '#page_navigation1' ).addClass( 'red-class' );
```
Et:
```
$( '#page_navigation1' ).removeClass( 'red-class' );
```
Où red-class est:
```
.red-class {
    background-color: red;
}
```
InformationsquelleAutor ThinkingStiff

Une fois que vous enlever les ID "page_navigation" cet élément n'est plus a un ID et donc ne peut pas être trouvé lorsque vous tentez d'accéder à un deuxième temps.

La solution est de mettre en cache une référence à l'élément:

$(document).ready(function(){
    //This reference remains available to the following functions
    //even when the ID is removed.
    var page_navigation = $("#page_navigation1");

    $("#add").click(function(){
        page_navigation.attr("id","page_navigation1");
    });     

    $("#remove").click(function(){
        page_navigation.removeAttr("id");
    });     
});

InformationsquelleAutor Sean Vieira

D'abord, vous pouvez ajouter une classe puis supprimer l'id

<script type="text/javascript">
$(document).ready(function(){   
 $("#page_navigation1").addClass("page_navigation");        

 $("#add").click(function(){
        $(".page_navigation").attr("id","page_navigation1");
    });     
    $("#remove").click(function(){
        $(".page_navigation").removeAttr("id");
    });     
  });
</script>

InformationsquelleAutor Shafiqul Islam

5

Si vous voulez faire cela, vous devez l'enregistrer dans une variable de première. Si vous n'avez pas besoin d'utiliser l'id de requête de cet élément à chaque fois.
```
var el = $("#page_navigation1");

$("#add").click(function(){
  el.attr("id","page_navigation1");
});     

$("#remove").click(function(){
  el.removeAttr("id");
});     
```
InformationsquelleAutor xdazz

Vous devez vous connecter pour publier un commentaire.