3

我是一个 jQuery 新手。我一直试图让 UI 滑块工作，但到目前为止还没有任何运气。我想要做的是能够将参数传递给函数，以便该参数可以用作滑块中的选择器。其中一个参数是滑块 div 的 id，另一个是伴随它的输入文本框的 id。哦，UI 滑块是一个基本的步进滑块，如演示中所示。

以下是与此相关的 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" ) );
}

在此先感谢您的帮助 ：）

4

1 回答 1

2

试试这个：

$(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 示例

您将变量而不是字符串传递给您的函数，并且您也没有正确引用 ID。

于 2012-07-09T16:38:26.200 回答