添加输入号码/文字范围

我有字符串输入范围添加输入号码/文字范围

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

它意味着一个部分的宽度。如果用户需要某些部分，他会单击添加按钮并获取新的输入范围的新字符串。所以我得到不同的值（零件的大小）的数组。

现在我需要添加重复范围值的输入数字/文本，反之亦然。用户可以输入一个数字，范围输入也会改变。或者他改变输入范围和输入数字也得到这个值。

我知道如何去做，但没有宽度数组。例如

<input type="range" name="width" min="40" max="200" value="40" 
oninput="this.form.widthPlus.value=this.value" /> <input 
type="number" name="widthPlus" min="40" max="200" value="40" 
oninput="this.form.width.value=this.value" />

有谁能告诉我该怎么做，要输入数字reapeat值并且如果用户用添加按钮添加新的字符串被克隆。我想我只能用JS/jQuery来做。

来源

2017-08-15 Mikhail

最简单的方法是每次只使用新的value属性。没有像width[]（不工作），而是width0，width1，width2，..

所以地方在你的代码，你有这将创建一个新的输入元素的功能：

var counter = 0; 
function addElement() { 
    var html = '<input type="range" name="width' +  counter + '" min="40" max="200" value="40" oninput="this.form.widthPlus' + counter + '.value=this.value" />' + 
       '<input type="number" name="widthPlus' + counter + '" min="40" max="200" value="40" oninput="this.form.width'  + counter + '.value=this.value" />'; 
    $(".outerContainer").append(html); 
    counter++; 
}

每次和用户点击一个按钮，你可以调用这个函数来添加一个新的元素。

还有一些不需要name-attribute向上计数的方法。如果用户输入了某些内容，则可以调用JS函数，然后使用jQuery来确定编辑了哪个元素（第n个孩子）。但是这有点复杂，需要更多的代码。

来源

2017-08-15 18:34:03 maja

谢谢。我纠正了一些时刻，并显示了两个输入。但是我的价值观存在问题。我问了一个新的问题这个话题 – Mikhail

此代码没问题。我纠正了一点点

var counter = 0; 
    $(document).ready(function(){ 
     var html = $("<input type='range' name='width' + counter + '' min='40' max='200' value='40' oninput='this.form.widthPlus' + counter + '.value=this.value' />" + 
"<input type='number' name='widthPlus' + counter + '' min='40' max='200' value='40' oninput='this.form.width' + counter + '.value=this.value' />"); 
     $(".form-col-2").append(html); 
     counter++; 
    });

来源

2017-08-15 21:29:29 Mikhail

添加输入号码/文字范围

回答

相关问题