jquery - jquery将变量分配给输入值最大值

Question

我有一个输入表单，我想为最大字段值分配一个变量。

这个变量是容器的宽度。

这是我未输入的html代码：

<input type="range" max="variable" step="1%" value="0"/>

我怎么能用jquery做到这一点。获取容器的宽度，然后在输入表单的最大值中分配它？

Answer 1

这是一种方法（有一个额外的输入文本框来显示范围的值）。

jsfiddle 演示

HTML：

<div id="container">
    <input type="range" max="variable" step="1%" value="0"/>
    <input type="text" />
    <span></span>
</div>

jQuery：

// cache re-usable jQuery elements
var $container = $('#container'),
    $range = $('[type="range"]'),
    $rangeValue = $('[type="text"]');

// initialize values:

// set range max to container width
$range.attr('max', $container.width());
// set rangeValue to range's value
$rangeValue.val($range.val());
// display container's width
$container.find('span').text('container width: ' + $container.width());

// events:

// set the rangeValue on range change
$range.change(function() {
    $rangeValue.val($range.val());
});

// set the range on rangeValue change
$rangeValue.change(function() {
    $range.val($rangeValue.val());
});

Answer 2

// Get the max attr
var arr = $("input").attr('max');
console.log(arr);  // variable 

// Set the max attr
$("input").attr('max', 100);

arr = $("input").attr('max');
console.log(arr);  // 100 

// Get the width of container and set the max attr
var width = $("#containerID").width()
$("input").attr('max', width);