Page 1 sur 1

Suppresion d'élément avec jQuery

Posté : 12 avr. 2010, 01:12
par djtec
Bonsoir,

Voilà ça fait au moins 2h que je m'énerve à supprimer une div mais rien ne fonctionne.

Voici mon script:

Code : Tout sélectionner

$("div.pop ul li a").click(function() { if(!$(this).hasClass("selected")) { $(this).addClass("selected"); $(this).append('<div id="delete"></div>'); Config.option.action = true; } }); $("div.pop ul li a.selected div").live('click', function() { $(this).parent().removeClass("selected"); $(this).parent().not($("#delete")[0]); Config.option.action = true; });
Et voici le html:
<div class="pop">
     <ul>
         <li><a href="#">lien 1</a></li>
         <li><a href="#">lien 2</a></li> 
         <li><a href="#" class="selected">lien 3 <div></div></a></li> 
         <li><a href="#">lien 4</a></li>
     </ul>               
</div>
Donc quand je clique sur le lien la class s'ajoute bien et quand je clique sur la div la class se supprime bien.

Par contre la div reste et donc si je reclique sur un lien qui était sélectionné avant deux div apparaisse et là problème vu que met div affiche une croix de suppression et ben je me retrouve avec deux croix au lieu d'une.

J'ai essayé plusieurs chose comme:

Code : Tout sélectionner

$("div.pop ul li a").not($("div.pop ul li a div"));
Ou:

Code : Tout sélectionner

$(this).parent().remove('<div></div>');
etc.....

Tout ce que j'essaye ne fonctionne pas donc est-ce que vous savez comment faire?

Merci d'avance...

++

Re: Suppresion d'élément avec jQuery

Posté : 12 avr. 2010, 01:29
par Nours312
salut :

t'as testé : $('#delete').remove() ??

http://api.jquery.com/remove/

@+

Re: Suppresion d'élément avec jQuery

Posté : 12 avr. 2010, 01:46
par djtec
J'avais testé:

Code : Tout sélectionner

$(this).remove();
Ton code fonctionne merci bcp je suis enfin tranquille avec ça.

Good night ++

Re: Suppresion d'élément avec jQuery

Posté : 12 avr. 2010, 02:01
par djtec
En faites non il y a un problème si je sélectionne trois éléments l'un derrière l'autre j'obtiens ceci:
<div class="pop">
     <ul>
         <li><a href="#" class="selected">lien 1 <div></div></a></li>
         <li><a href="#" class="selected">lien 2 <div></div></a></li>
         <li><a href="#" class="selected">lien 3 <div></div></a></li>
         <li><a href="#">lien 4</a></li>
     </ul>              
</div>
Et je veux supprimer le troisième et bien ca me supprime aussi le deuxième sans supprimer la classe donc j'obtiens:
<div class="pop">
     <ul>
         <li><a href="#" class="selected">lien 1</a></li>
         <li><a href="#" class="selected">lien 2 <div></div></a></li>
         <li><a href="#">lien 3</a></li>
         <li><a href="#">lien 4</a></li>
     </ul>              
</div>

Re: Suppresion d'élément avec jQuery

Posté : 12 avr. 2010, 14:47
par AB
<li><a href="#" class="selected">lien 3 <div></div></a></li>
C'est pas valide comme code. On ne peut pas mettre un élément de type bloc (div) à l'intérieur d'un élément de type en ligne <a>

Re: Suppresion d'élément avec jQuery

Posté : 12 avr. 2010, 18:13
par djtec
Au début j'avais mit un span mais la croix n'apparaissait pas donc j'ai mit une div la elle apparait donc si ta une idée pour que je mette autre chose que la div je suis preneur.

Re: Suppresion d'élément avec jQuery

Posté : 12 avr. 2010, 23:30
par Nours312
une span .. avec des dimensions stricts ! ya pas de raison que ça ne s'affiche pas !...

et pourquoi ne pas mettre directement une <img /> ? si c'est pour une croix cliquable ... ce serait peu-être mieux non ?

Re: Suppresion d'élément avec jQuery

Posté : 13 avr. 2010, 00:08
par djtec
Justement j'ai mit une span avec des dimensions mais le width n'est pas respecté.

Voici mon code:
.option .select .pop ul li a.selected span{
        display:block;
	float:right;
	background-image:url(images/delete.png);
	background-position:0 0;
	background-repeat:no-repeat;
	width:15px;
	height:15px;
}

.option .select .pop ul li a.selected span:hover{ background-position:-15px 0; }
Mais mes deux croix apparaisse et quand je met la souris dessus une seule apparait.

Bizarre quand même.

Re: Suppresion d'élément avec jQuery

Posté : 13 avr. 2010, 00:51
par AB
Et pourquoi pas la proposition de Nours312 avec une simple balise <img ...> et un roolover en javascript qui change la source de l'image ?
Souvent bien plus facile à mettre en place, et si js désactivé la fonctionnalité existe encore et seul l'effet disparaît donc no souci...

Re: Suppresion d'élément avec jQuery

Posté : 14 avr. 2010, 11:55
par djtec
Ok je vais voir ça pour la balise img et je pense que je vais interdire la visualisation du site si js est désactivé car sinon le visiteur ne pourra bien naviguer car plusieur fonction ne pourra être mise en place en php donc le site ne pourra fonctionner bien du moins la recherche dans plusieur catégories.

Re: Suppresion d'élément avec jQuery

Posté : 14 avr. 2010, 15:02
par Nours312
Ok je vais voir ça pour la balise img et je pense que je vais interdire la visualisation du site si js est désactivé car sinon le visiteur ne pourra bien naviguer car plusieur fonction ne pourra être mise en place en php donc le site ne pourra fonctionner bien du moins la recherche dans plusieur catégories.
pas bien !... :non:

Re: Suppresion d'élément avec jQuery

Posté : 14 avr. 2010, 16:52
par djtec
Le truc c'est la classe .pop n'apparait que par le biais de js donc si le js est dé"désactivée automatique ment la class .pop ne peu plus être afficher.

Et les élément li qui ont la class .selected sont les éléments choisi par le visiteur mais eux aussi ne peuvent être sélectionné par js et puis je recharge les données que une fois la div .pop refermer et si js est désactivé je dois faire une page avec des checkbox c'est bien ça???

Re: Suppresion d'élément avec jQuery

Posté : 14 avr. 2010, 17:19
par AB
Le plus pratique selon moi pour faire du js non intrusif, c'est de faire d'abord les fonctionnalités de navigation en php et ensuite d'ajouter la couche javascript.
Prends conscience que google n'interprète pas le javascript et donc en plus d'handicaper les visiteurs qui n'auraient pas js activé, les pages accessibles uniquement par un menu javascript ne pourront pas être référencées.

Re: Suppresion d'élément avec jQuery

Posté : 14 avr. 2010, 17:30
par Nours312
AB ++

et dans ton cas, tu dois faire en sorte que tout existe, (liens <a> pour supprimer entourant les images, ... /* si j'ai bien compris */) et ensuite, la couche de javascript viens "agrémenté" le confort de l'utilisateur ... ...

1. tu monte ton site
2. tu réfléchis à comment rendre plus agréable ce site pour certains utilisateurs (95% ^^ )

mais pas l'inverse ;)

Re: Suppresion d'élément avec jQuery

Posté : 15 avr. 2010, 19:41
par djtec
Je pense que je vais mettre un select à la place et que je vais essayer de le stylé avec jQuery à la façon que j'ai montré plus haut.