La plage d'entrée obtient la valeur du nombre d'entrée et vice versa (oninput = ...)

Question

J'ai 2 entrées avec la gamme de type et le nombre qui obtiennent des valeurs de l'un l'autre.

Voici le code de travail:

<form> 
    <input type="range" name="height" min="0" max="20" value="0" oninput="this.form.heightPlus.value=this.value" /> 
    <input type="number" name="heightPlus" min="0" max="20" value="0" oninput="this.form.height.value=this.value" /> 
</form> 

Mais je dois mettre en div, pas sous forme.

Comment dois-je changer oninput

oninput="this.form.width.value=this.value" 

J'ai essayé smth comme

$('input[name=height]').val() 

mais aucun résultat

Answer 1

Dans ce cas, vous généralement donner à chaque élément d'entrée d'une propriété id unique, et utilisez window.getElementById('idValue').value =... pour définir la valeur. Cela ne nécessite même pas jQuery.

HTML:

<input type="range" id="idValue" min="0" max="20" value="0" oninput="window.getElementById('otherIdValue')=this.value" /> 

Answer 2

J'espère que cela vous aide

<div> 
    <input type='range' name="height" id='height' min='0' max='20' value='0' oninput='document.getElementById("heightPlus").value=this.value' /> 
    <input type='number' name="heightPlus" id='heightPlus' min='0' max='20' value='0' oninput='document.getElementById("height").value=this.value' /> 
</div> 

Pour votre violon changer le code Jquery comme ci-dessous

Html:

<div class="gallery-slider" ></div> 

Jquery:

var counter = 0; 
$('.gallery-slider').append("<input type='range' id='width' name='width" + counter + "' min='40' max='200' value='40'/><input type='number' id='widthPlus' name='widthPlus" + counter + "' min='40' max='200' value='40'/>"); 
$(document).on('input', '#width', function(event) { 
    $(this).next().val($(this).val()); 
}); 
$(document).on('input', '#widthPlus', function(event) { 
    $(this).prev().val($(this).val()); 
}); 

Answer 3

J'ai "string" de 4 colonnes: 1. Sélectionnez (genre de chose) 2. Plage d'entrée + (numéro d'entrée (maintenant ajouté)) (hauteur de chose) 3. Plage d'entrée + (numéro d'entrée (maintenant ajouté)) (largeur de chose) 4. Calcul en lecture seule en entrée

L'utilisateur saisit les données des 3 premières colonnes, puis il peut en ajouter un (puis deux, trois ...) plus de chaînes (cliquez sur le bouton Ajouter) ou allez au formulaire de rappel (bouton Soumettre). Quand il clique sur le formulaire de soumission est ouvert et il ya un formulaire popup avec certains champs: nom, téléphone, données utilisateur dans la zone de texte: 1. Chose Type 1 40x60 2400 2. Chose Type 2 40x50 2000 .... Données texarea obtient via form = "envoyer". Tout a très bien fonctionné, mais j'ai besoin d'ajouter un numéro d'entrée qui duplique la valeur de plage d'entrée et vice versa. Plage d'entrée d'abord regardé de cette façon en html

<div class="gallery"> 
<input form="send" type="range" min="40" max="300" name="width[]" value="40"> 
</div> 

puis je l'ai effacé de html et ajouté via jQuery que vous pouvez voir: jsfiddle.net/MikhailZ/2dJAN/1496

Maintenant, j'ai des problèmes avec compteur. Nom = largeur1 dans chaque chaîne. Egalement un problème avec .append/.html Quand j'avais .append quand j'ai obtenu un formulaire popup, je cliquais sur le bouton submit et obtenais une plage d'entrée et un nombre d'entrée supplémentaires dans chaque div de chaque chaîne. Je change pour.html, pas de clonage mais maintenant quand je reçois des valeurs d'entrée min pour faire un popup. Par exemple, l'utilisateur a choisi 1. Type de chose 1 100x60 6000 mais sous la forme je reçois 1. Chose Type 1 40x40 6000