3

私はjQueryの初心者です。UI スライダーを機能させようとしてきましたが、今のところうまくいきません。私がやりたいのは、パラメーターを関数に渡して、パラメーターをスライダーのセレクターとして使用できるようにすることです。パラメーターの 1 つはスライダーの div の ID で、もう 1 つはそれに付随する入力テキスト ボックスの 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 に答える