Question

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

以下是与此相关的HTML和JS文件的一部分：

HTML PART：

<!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 Part：

$(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" ) );
}

提前感谢您的帮助：）

Answer 1

试试这个：

$(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滑块并为选择器传递不同的参数？

1 个答案: