11548 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Petit problème de mise a jour d'un INPUT via JS

Bonjour a toutes et tous,

J'ai un petit bug dont je ne parvient pas à trouver la solution ici (c'est rare).

Je me suis réalisé des jolis INPUT à boutons +/- pour faciliter la saisie. Ils fonctionnent très bien à l'exception d'un petit détail gênant: le click sur un des 2 boutons sélectionne de temps en temps du texte dans la page (des espaces).

http://amaxonline.free.fr/alsa/bug_input.jpg

Quelqu'un a une idée SVP ?

EDIT: j'oubliai, ça sélectionne également le contenu de l'INPUT de manière tout aussi aléatoire.
Modifié par AMaX (22 May 2012 - 14:34)
Salut,

je ne crois pas avoir deja rencontre ce genre de bug. C'est sur un navigateur specifique que ca arrive? Est-ce que tu peux poster le code html correspondant?
Modifié par martint (22 May 2012 - 17:01)
A ma connaissance, cet effet fort sympathique est systématique sur opera dès qu'on double clic sur un élément... (sélection automatique de l'élément)

Et si tu trouves comment l'empêcher, je prends de suite, mais je doute vraiment que tu le trouves. Smiley confus
Effectivement l'effet indésirable ne se produit que sous FF, et non sous Chrome (je n'ai pas Opera d'installer, faut que j'y pense d'ailleurs pour les tests...).

Pour poster mon code, c'est pas que je ne veux pas, mais c'est pas simple vue que c'est une fonction PHP qui produit les INPUT a boutons, plus du JS pour les boutons et que le tout gère plusieurs type de données dans l'INPUT. Ca va faire un pavé a relire. Si aucune solution n'est apportée d'ici 2 jours, je produirais une version light du code pour la poster ici.
salut...

On va t'épargner du temps... il n'y apas de solutions, il se trouve que tes boutons sont en js, il n'y a donc pas de reconnaissance de "clic" par le browser (qui gère ça sur les boutons et les a)

après suivant le browser, les clics successifs provoquent la sélection... Smiley decu

c'est chiant... très et ça arrive tout le temps !!! grrrr
Erf, même pas une commande jQuery qui dé-sélectionnerait toute la page après chaque click ?

En tout cas, je viens de remarquer qu' effectivement, le problème ne se pose pas si je prends mon temps entre chaque click.
Modifié par AMaX (22 May 2012 - 17:40)
Lothindil a écrit :
Et un <a> sans href autour du bouton avec le bouton en image ça marcherait pas ? (et le onClick sur le <a>)


Ouais, je vais tester avec une autre méthode que les sprites pour voir, mais bon...
Mais un <a> sans HREF c'est pô valide 1.1 ^^
Modérateur
a écrit :
Erf, même pas une commande jQuery qui dé-sélectionnerait toute la page après chaque click ?

Ben si, donner le focus à un élément a pour mérite d'annuler toute sélection (qui est une forme de focus), ici dans ce spinner, ça marche bien en donnant le focus au champ: en plus ça permet de modifier au clavier les valeurs, et ça c'est carrément classe.

http://btburnett.com/spinner/example/example.html
Modifié par kustolovic (23 May 2012 - 14:36)
Modérateur
et puis bon, je n'ai jamais encore testé ça, mais je me demandais si pour le futur utiliser ça:


  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  user-select: none;

pourrait être utile dans ce cas
AMaX a écrit :
Voici un exemple de mon petit problème: http://amaxonline.free.fr/input_boutons/index.php

La sélection indésirable dans la page se produit entre les inputs lorsque que l'on incrémente les input de gauche. Le problème ne se produit pas lors de l'utilisation de ceux de droite.


C'est vraiment bizarre. Si tu enleves le margin de ton element div principal ou le change en padding, ou si tu le positionne en absolu ton probleme ne se produit pas.

C'est comme si il selectionnait le "vide".
Modifié par martint (23 May 2012 - 15:19)
kustolovic a écrit :
Erf, même pas une commande jQuery qui dé-sélectionnerait toute la page après chaque click ?

Ben si, donner le focus à un élément a pour mérite d'annuler toute sélection (qui est une forme de focus), ici dans ce spinner, ça marche bien en donnant le focus au champ: en plus ça permet de modifier au clavier les valeurs, et ça c'est carrément classe.

http://btburnett.com/spinner/example/example.html

Bon je vais quand même tester vos proposition dés que possible, mais je me demande si je vais pas passer par les spinners que tu viens de me proposer. Ils sont un peu petits, mais offre l’énorme avantage de gérer la molette souris, et ça, ça n'a pas de prix ^^

Merci, je ne connaissais pas...
martint a écrit :
C'est comme si il selectionnait le &quot;vide&quot;.


C'est ça, il sélectionne 3 nbsp qui séparent les 2 inputs
Modérateur
AMaX a écrit :
Ils sont un peu petits, mais offre l’énorme avantage de gérer la molette souris, et ça, ça n'a pas de prix ^^

En même temps en ajoutant ou modifiant quelques règles css, tu peux le faire plus grand et côte-à-côte.
kustolovic a écrit :

En même temps en ajoutant ou modifiant quelques règles css, tu peux le faire plus grand et côte-à-côte.


Ouais, ben ça m'apprendra a vouloir réinventer la roue ^^
Je vais passer par le spinner jQuery en fait...

Merci pour votre aide !
Juste un p'tit up car concernant la sélection automatique du contenu de l'input ou sur la page sous FF, j'ai trouvé ça:

document.getSelection().removeAllRanges();

Modifié par AMaX (11 Jun 2012 - 09:36)
Sujet clos
Aller à