Jquery : cibler l'élement précédent

Bonjour,
Je comprends pas pourquoi ce code ne fonctionne pas. Il y a plusieurs éléments field dans le doc sur lesquels je dois cibler l'élément précédent.

    $( ".field" ).on( "click", function() {
	   $(this).prev().addClass( "is-moved" );
    });

Modifié par Hermann (21 Oct 2020 - 17:10)

Salut,

Ton code fonctionne bien pour moi. il ne fait peut etre pas ce que tu attends par contre :
https://jsfiddle.net/undless/8u5atmco/

Tu peux nous donner ton html et nous dire ce que tu attends ?

_laurent a écrit :
Salut,

Ton code fonctionne bien pour moi. il ne fait peut etre pas ce que tu attends par contre :
https://jsfiddle.net/undless/8u5atmco/

Tu peux nous donner ton html et nous dire ce que tu attends ?

Effectivement, merci du test. Je voudrais simplement ajouter le class en question sur le label au click sur l'input.

Le HTML

<td>
<label for="TEST-B">Portable</label>
<input type="text" class="field" id="TEST-B" value=""></td>

Bah ca marche tout aussi bien non ?
https://jsfiddle.net/undless/8L6skvwt/3/

_laurent a écrit :
Bah ca marche tout aussi bien non ?
https://jsfiddle.net/undless/8L6skvwt/3/

Oui bizarre, car je pense pas que ça soit lié à la présence de plusieurs field qui doivent faire la même action dans la même page.

Et l'eau,

ça fait zizir de te revoir Hermann

Est ce que ton code est valide ?
Sinon :

$( ".field" ).on( "click", function() {
   $(this).parent().find('label').addClass( "is-moved" );
});

en natif :

document.querySelectorAll('.field').forEach($input =>{
    $input.addEventListener('click', e => e.target.previousElementSibling.classList.add('is-moved'); );
})

document.querySelectorAll('.field').forEach($input =>{
    $input.addEventListener('click', e => e.target.parentNode.querySelector('label').classList.add('is-moved'); );
});

*Code fait de tête. Il se peut qu'il y ait une coquille. j'ai enlevé les accolades. ça devrait fonctionner sans.
Modifié par niuxe (21 Oct 2020 - 23:58)

niuxe a écrit :
Et l'eau,

ça fait zizir de te revoir Hermann

Est ce que ton code est valide ?
Sinon :

$( ".field" ).on( "click", function() {
   $(this).parent().find('label').addClass( "is-moved" );
});

en natif :

document.querySelectorAll('.field').forEach($input =>{
    $input.addEventListener('click', e => e.target.previousElementSibling.classList.add('is-moved'); );
})

document.querySelectorAll('.field').forEach($input =>{
    $input.addEventListener('click', e => e.target.parentNode.querySelector('label').classList.add('is-moved'); );
});

*Code fait de tête. Il se peut qu'il y ait une coquille. j'ai enlevé les accolades. ça devrait fonctionner sans.

Tiens tiens (mince j'ai oublié ton ancien pseudo ) ! Toujours fidèle au poste je vois (et modo avec ça !)

J'ai pas testé la validité du JS mais ce qui est en aval est exécuté. J'ai l'impression que c'est le prev qui pose problème. Merci, je vais tester ça.

Hermann a écrit :


Tiens tiens (mince j'ai oublié ton ancien pseudo ) ! Toujours fidèle au poste je vois (et modo avec ça !)

Nolem

Mais chut parce qu'il y a surement des gens qui vont nous lire

Hermann a écrit :

J'ai pas testé la validité du JS mais ce qui est en aval est exécuté. J'ai l'impression que c'est le prev qui pose problème. Merci, je vais tester ça.

Je me suis mal exprimé. validité html
Modifié par niuxe (22 Oct 2020 - 21:04)