我是 jQuery 新手。我一直在尝试让 UI slider 正常工作，但到目前为止还没有任何运气。我想要做的是能够将参数传递给函数，以便该参数可以用作 slider 中的选择器。其中一个参数是 slider div 的 id，另一个参数是与其一起的输入文本框的 id。哦，UI slider 是一个基本的步骤 slider ，如演示中所示。
以下是与此相关的 HTML 和 JS 文件部分:
HTML 部分:
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="content/jquery-ui/development-bundle/themes/smoothness/jquery.ui.all.css">
<script type="text/javascript" src="content/jquery-ui/development-bundle/jquery-1.7.2.js"></script>
<script type="text/javascript" src="content/jquery-ui/development-bundle/ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="content/jquery-ui/development-bundle/ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="content/jquery-ui/development-bundle/ui/jquery.ui.mouse.js"></script>
<script type="text/javascript" src="content/jquery-ui/development-bundle/ui/jquery.ui.slider.js"></script>
<script type="text/javascript" src="journal.js"></script>
</head>
<body>
<section id="journalEntry">
<div id="base">
<label for="intensity">How intense was it?</label> <input type="text" id="intensity" /><div id="intensityGuage"></div>
</div>
</section>
</body>
</html>
jQuery 部分:
$(document).ready(function(){
guageBar(intensityGuage,intensity);
});
function guageBar(guageId,inputId){
$( "[id='"+guageId+"']" ).slider({
value:1,
min: 1,
max: 10,
step: 1,
slide: function( event, ui ) {
$( "id[='"+inputId+"']" ).val( ui.value );
}
});
$( "id=['"+inputId+"']" ).val( $( "id=['"+guageId+"']" ).slider( "value" ) );
}
预先感谢您的帮助:)
最佳答案
试试这个:
$(document).ready(function() {
guageBar('intensityGuage', 'intensity');
});
function guageBar(guageId, inputId) {
$("#" + guageId).slider({
value: 1,
min: 1,
max: 10,
step: 1,
slide: function(event, ui) {
$("#" + inputId).val(ui.value);
}
});
$("#" + inputId).val($("#" + guageId).slider("value"));
}
<强> jsFiddle example
您向函数传递了变量而不是字符串，而且您也没有正确引用 ID。
关于jquery-ui - 如何在函数中使用 jQuery UI slider 并为选择器传递不同的参数？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11398404/