J'ai un petit problème: je veux sortir le champ de saisie dans le texte HTML (voir image):
p>
voici mon code: p>
p>
<div class="container content-center" id="margin">
<form name="formcalc">
<div class="form-group row">
<label for="staticEmail" class="col-sm-2 col-form-label">Einkommen</label>
<div class="col-sm-10">
<!-- <div class="input-group-addon">Fr.</div> -->
<input type="text" class="form-control" name="txtnum1">
</div>
</div>
<fieldset disabled>
<div class="form-group row">
<label for="staticEmail" class="col-sm-2 col-form-label">Number 1</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="txtres" value="Fr. " readonly>
</div>
</div>
<div class="form-group row">
<label for="staticEmail" class="col-sm-2 col-form-label">Number 2</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="txtres2" value="Fr. " readonly>
</div>
</div>
</fieldset>
<input type="button" class="btn btn-danger" value="Berechnen" onClick="sumValues()">
</form>
<hr class="featurette-divider">
<section class="container">
<p class="lead" id="lead"> Number 1 is: XXX. Number 2 is: XXX.
</p>
</section>
</div>3 Réponses :
Vous devez créer la fonction Sumvalues (). Vous devriez faire quelque chose comme: pour que cela fonctionne, vous devez ajouter l'attribut "ID" (N1 et N2) à chaque entrée, comme: P> <input id="n1" type="text" class="form-control" name="txtres" value="Fr. " readonly>
<input id="n2" type="text" class="form-control" name="txtres2" value="Fr. " readonly>
La question est étiquetée avec jQuery, vous pouvez donc utiliser Sélecteur JQuery au lieu de ces grands document.getElementByID ()
Pouvez-vous me montrer les gars que voulez-vous dire par une section de code complète? Je suis nouveau à ceci: /
edit: strong> Si vous avez déjà JavaScript sur votre page, placez-la avec cela. Sinon, placez-le dans une étiquette de script au bas du document.getElementById("lead").textContent = "Number 1 is: " + num1 + ". Number 2 is: " + num2 + ".";
Où mettre ce code? Dans le code HTML, conteneur?
ça a marché! Mais pourquoi j'ai besoin d'appuyer deux fois sur le bouton avant que les valeurs d'entrée ne le montre?
Oui. Je l'ai comme ceci:
@zenubeh pourriez-vous modifier votre question pour clarifier ce que vous demandez? À partir de la photo, il semble que vous souhaitiez simplement obtenir les deux chiffres, mais à partir de votre fonction nommée Sumvalues (), on dirait que vous essayez de faire plus. Toute information supplémentaire serait très utile :)
Je suis nouveau à Stackoverflow Can Sho me montrer comment mettre le code ein ici
Sûr. Cliquez sur le bouton 'Modifier' sous votre question. Cela mènera l'éditeur. Ensuite, vous pouvez écrire du code en utilisant trois accents graves (cette chose => `) Comme:` `` `code va ici" "Assurez-vous de mettre fin à votre code avec trois accents plus graves
num5 = $ ('[nom = txtres]'). Val (); num6 = $ ('[nom = txtres2]'). Val (); $ ('# plomb'). Texte ("numéro 1 est:" + num5 + ". Numéro 2 est:" + num6 + "."); document.formcalc.txtres.value = 'Fr. '+ Maths.round (num3) +' .- '; document.formcalc.txtres2.value = 'Fr. '+ Maths.round (num4) +' .- '; }
Ok, je l'ai eu. Est ce que ça marche maintenant? Si cela ne fonctionne pas, qu'est-ce qui ne va pas avec ça?
Lorsque je tapez le bouton pour la première fois, le texte apparaît mais sans les valeurs d'entrée. Lorsque j'appuie sur le bouton pour la deuxième fois que les valeurs d'entrée apparaissent. Donc j'ai besoin d'appuyer deux fois sur le bouton
Avez-vous supprimé le texte du titulaire de la place du HTML? Courant: numéro 1 est: xxx. Le numéro 2 est: xxx. . Nouveau:
Hmm, ma dernière hypothèse serait
hm non, toujours le même: après avoir appuyé deux fois sur le bouton
const form = document.forms['formcalc'];
const button = form.querySelector('input[type=button]');
button.addEventListener('click', (e) => {
const inputNumberOneValue = form.elements['txtres'].value;
const inputNumberTwoValue = form.elements['txtres2'].value;
const result = document.querySelector('#lead');
result.innerText = ` Number 1 is: ${inputNumberOneValue}. Number 2 is: ${inputNumberTwoValue}`;
})
Qu'avez-vous déjà essayé? Poster un code javascript / jquery de choses que vous avez déjà essayées
J'ai essayé mais j'ai supprimé le code. Je pensais peut-être que certains d'entre vous peuvent m'aider
Vous n'avez pas ajouté de valeur dynamique dans XXX et vous devez appeler un événement de clic et vous devez ajouter le contenu avec JavaScript ou JQuery.
Obtenez les valeurs des entrées par ID donnant un attribut d'identifiant, puis ajoutez-les au DOM avec innerhtml ou une meilleure annexe. N'oubliez pas de pour la première fois les valeurs parce qu'elles sont du texte.