输入范围获得输入数值的值，反之亦然（oninput = ...）

我有2个输入与类型范围和数量，它们可以得到彼此的值。输入范围获得输入数值的值，反之亦然（oninput = ...）

这里是工作代码：

<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>

但我需要投入DIV，而不是形式。

我应该如何改变oninput

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

我试图水木清华像

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

，但没有结果

来源

2017-08-16 Mikhail

在这种情况下，你通常会给予每个输入元素的独特id属性并使用window.getElementById('idValue').value =...来设置该值。这甚至不需要jQuery。

HTML：

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

来源

2017-08-16 04:37:05 maja

我希望这有助于你

<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>

为了您的提琴改变jQuery代码如下

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()); 
});

来源

2017-08-16 05:01:53 PraveenKumar

谢谢。但是我不能在我的代码中工作这个代码。你能帮我吗？ http://jsfiddle.net/MikhailZ/2dJAN/1495/我认为这个问题用引号引起来，但我试了几百个版本，没有结果 – Mikhail

在我的回答中做了一个编辑，检查一下 – PraveenKumar

谢谢。你的代码很棒。但我再次遇到问题。如果你让我问你。我昨天有一个问题https://stackoverflow.com/questions/45698929/add-input-number-text-to-range/45699269#45699269关于如何将输入数字添加到范围然后获取数组的值。最终代码：jsfiddle.net/MikhailZ/2dJAN/1496但是：1. Counter always = 1 2.我将.append更改为.html，因为点击提交时克隆输入有问题，但现在.html返回当前输入的最小值我点击提交按钮。我打破了我的大脑 – Mikhail

我有4列的 “串”： 1.选择（类型的东西） 2.输入范围+（输入号码（现在的加））（事情高度） 3.输入范围+（输入数字（现在加））（物品宽度） 4.输入只读计算

用户输入前3列的数据得到结果，然后他可以添加一个（然后二，三... ）更多的字符串（点击添加按钮）或转到回叫形式（提交按钮）。当他点击提交表单时，会弹出一些字段：文本框中的姓名，电话，用户数据： 1.事物类型1 40x60 2400 2.事物类型2 40x50 2000 .... 数据texarea通过form =“send”获取。

一切都很好，但我需要添加重复输入范围值的输入数字，反之亦然。输入范围在第一次看到这样的HTML

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

然后我从HTML中删除它，并通过jQuery添加你可以看到：jsfiddle.net/MikhailZ/2dJAN/1496

现在我有问题计数器。名称=每个字符串中的width1。也有问题.append/.html 当我有.append当我弹出窗体时，我单击提交按钮，并获得一个更多的输入范围和每个字符串的每个div的输入数字。我改为。HTML，没有克隆，但现在当我得到最小输入值弹出窗体。例如，用户选择1.事物类型1 100x60 6000 但形式我得到1.事物类型1 40x40 6000

来源

2017-08-16 12:51:35 Mikhail

你可以把你当前的代码在小提琴来检查 – PraveenKumar

@PraveenKumar，https://jsfiddle.net/MikhailZ/Lu22caa1/我添加所有代码之前提交按钮，因为它是大回调插件。如果您需要更多信息，请让我知道 – Mikhail

输入范围获得输入数值的值，反之亦然（oninput = ...）

回答

相关问题