Puis-je ajouter une valeur avant ou après une valeur d'entrée?
Je souhaite modifier le texte affiché pour la valeur, mais sans changer la valeur. Donc, si je lisais la valeur, il devrait toujours renvoyer 1000. p> Comment puis-je ajouter le texte foo code> avant ou
bar < / Code> Après 1000 Withouth Changement de la valeur elle-même? p>
5 Réponses :
Ce moyen le plus simple serait de et des éléments avant et après: puis utilisez CSS pour styler le
Je ne sais pas pourquoi cela est bullevé. Il n'est pas clair de la part de l'op de quoi le supplément foo code> et
bar code> est pour. C'est sans doute la meilleure façon du point de vue de l'accessibilité? Ou nous pourrions tout coller dans un attribut de données et coller deux doigts jusqu'à l'accessibilité?
Utiliser l'attribut de données pour une entrée multiple
p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script> <input class="myInput" type="text" data-before="foo" data-after="bar" value="1000"> <input class="myInput" type="text" data-before="foo1" data-after="bar1" value="1000"> <input class="myInput" type="text" data-before="foo2" data-after="bar2" value="1000">
J'ai besoin de foo et de barre pour ne être visible que pas éditable. Mais je n'ai pas mentionné cela, alors c'est de ma faute
Ensuite, comment voulez-vous que toute la chose soit affichée?
Comme FOO 1000 bar code>, mais seulement
1000 code> devrait être modifiable. Dans la vraie application, je souhaite ajouter
mm code> (MILI Mètres) après la valeur d'entrée. Je pensais pouvoir le résoudre avec CSS: après, mais je n'ai pas pu le faire.
Entrée CODE> S N'a pas de pseudo-éléments. Par conséquent, vous ne pourrez pas utiliser
:: avant code> et
:: après code> pour cela. Cependant, vous pouvez l'envelopper avec un
span code>, puis utiliser les éléments pseudo.
@Nimsrules, pouvez-vous donner un exemple s'il vous plaît?
Veuillez vérifier mon édition ici - Stackoverflow.com/a/56109751/2427237
edit strud> p> le marquage p> p> var saise = document.getelementbyID ('myInput');
INPUT.VALUE = "FOO" + INPUT.VALUE + "BAR";
code>
<span>
<input id="myInput" type="text" value="1000">
</span>
J'ai besoin du contenu mm code> à côté de la valeur, mais cela semble impossible, alors j'accepte votre réponse.
Bien que ce ne soit pas la plus élégante, une possibilité serait d'inclure les parties "FOO" et "bar" de la chaîne de l'attribut de valeur de l'élément via une fonction d'assistance (c.-à-d. p> SETValue () code> ci-dessous ), puis "assainir" ces pièces supplémentaires hors de la valeur des entrées lors de l'accès à la valeur souhaitée de l'entrée (c.-à-d.
getvalue () code> ci-dessous):
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input id="myInput" type="text" value="1000">
Mais "foo" et "bar" peuvent toujours être édités par l'utilisateur.
C'est vrai, j'ai besoin de foo et de barre pour ne être visible que pas éditable. Mais je n'ai pas mentionné cela, alors c'est de ma faute.
peut enregistrer la valeur 1000 dans la valeur de données = "1000" p>
p>
et peut sélectionner cette valeur par document.QuerySelectorallall ('[valeur de données]'); p>
ou p>
en utilisant p>
p>
première entrée à afficher et deuxième à poster sur serveur p>
J'ai besoin de foo et de barre pour ne être visible que pas éditable. Mais je n'ai pas mentionné cela, alors c'est de ma faute
avant / après l'élément sur une enveloppe?
Voulez-vous ajouter un élément HTML après et avant l'élément d'entrée? Ou ajoutez-les dans la valeur? Ce n'est pas clair que voulez-vous réaliser.
Ce n'est pas clair ce que vous demandez. Cherchez-vous à modifier la valeur du champ de saisie ou recherchez-vous un texte de décoration qui ressemble à une partie de l'entrée, mais n'est pas, comme des étiquettes (c'est-à-dire
payer 1000 $ code> où
payer code> et
$ code> est décoration)?
Je veux modifier le texte affiché pour la valeur, mais sans changer la valeur. Donc, si je lisais la valeur, il devrait toujours retourner 1000.