75  

This uses Javascript, not jquery directly. It might help get you started.

这使用的是Javascript，而不是jquery。它可能会帮助你开始。

function updateTextInput(val) {
          document.getElementById('textInput').value=val; 
        }

119  

For those who are still searching for a solution without a separate Javascript code. There is little easy solution without writing a Javascript or jquery function:

对于那些仍然在寻找没有独立Javascript代码的解决方案的人来说。如果不编写Javascript或jquery函数，几乎没有简单的解决方案:

   
   
24

JsFiddle Demo

JsFiddle演示

If you want to show the value in text box, simply change output to input.

如果要在文本框中显示值，只需将输出更改为input。

Update:

更新:

It is still Javascript written within your html, you can replace the bindings with below JS code:

它仍然是在html中编写的Javascript，您可以用以下JS代码替换绑定:

 document.registrationForm.ageInputId.Oninput= function(){
    document.registrationForm.ageOutputId.value = document.registrationForm.ageInputId.value;
 }

Either use element's Id or name, both are supported in morden browsers.

无论是使用元素的Id还是名称，在现代浏览器中都是受支持的。

29  

version with editable input:

版本与可编辑的输入:

http://jsfiddle.net/Xjxe6/

http://jsfiddle.net/Xjxe6/

14  

an even better way would be to catch the input event on the input itself rather than on the whole form (performance wise) :

更好的方法是在输入本身而不是整个表单上捕获输入事件(性能方面):

                                                       

0

Here's a fiddle (with the id added as per Ryan's comment).

这里有一个小提琴(根据Ryan的评论添加id)。

9  

If you want your current value to be displayed beneath the slider and moving along with it, try this:

如果你想让你的当前值显示在滑块下面并随它移动，试试这个:

  
  



  
MySliderValue

  

    
    
    
     
  

  

Note that this type of HTML input element has one hidden feature, such as you can move the slider with left/right/down/up arrow keys when the element has focus on it. The same with Home/End/PageDown/PageUp keys.

注意，这种类型的HTML输入元素有一个隐藏的特性，例如，当元素集中于它时，您可以使用左/右/向下/向上的箭头键移动滑块。Home/End/PageDown/PageUp键也是如此。

4  

If you're using multiple slides, and you can use jQuery, you can do the follow to deal with multiple sliders easily:

如果您正在使用多个幻灯片，并且您可以使用jQuery，那么您可以轻松地处理多个幻灯片:

function updateRangeInput(elem) {
  $(elem).next().val($(elem).val());
}

input { padding: 8px; border: 1px solid #ddd; color: #555; display: block; }
input[type=text] { width: 100px; }
input[type=range] { width: 400px; }

Also, by using oninput on the you'll receive events while dragging the range.

另外，通过在上使用oninput，您将在拖动范围时接收事件。

1  

0  

if you still looking for the answer you can use input type="number" in place of type="range" min max work if it set in that order:
1-name
2-maxlength
3-size
4-min
5-max
just copy it

如果你还在寻找答案，你可以使用input type="number"来代替type="range"最小化工作量，如果它按这个顺序设置:1-name 2-maxlength 3-size 4-min 5-max只需复制它