0

問題があります。span要素を追加するjsコードがあります。私の問題はそれが消え続けることであり、それはバグか何かではありません。

PS：私はjquery uiスライダーを使用しています。私が行っているのは、追加された要素（スパン）を使用してスライダーの現在の値を表示することです。唯一の問題は、他のスライダーをクリックすると消え続けることです。

これが私のコードです：HTML

<div id = "opacity" class="slider-range"></div><br>
<div id = "volume" class="slider-range"></div><br>

Javascript

var append_element = $('<span></span>');
        $('.slider-range').slider( {
            animate : true,
        });

        $("#opacity").slider({
            min     : 0,
            max     : 100,
            value   : 60,
            step    : 10,
            change  : function(event, ui) {
                slider_value('#opacity', ui.value);
            }
        });

        $("#volume").slider({
            min     : 0,
            max     : 100,
            value   : 20,
            step    : 10,
            change  : function(event, ui) {
                slider_value('#volume', ui.value);
            }
        });

        function slider_value(id, response) {
            append_element.removeClass().appendTo(id);
            //remove '#' / get id
            id = $(id).attr('id');

            var new_span = $('span').addClass('slider-value-'+id);
            $(new_span).html(response);
            console.log(new_span);
        }

誰。ここで私の髪を引っ張るT_T。

ありがとう。

4

1 に答える 1

1

ページ全体で 1 つのスパンを使用しているだけです。それを消したくない場合は、複数のスパンを使用する必要があると思います。

したがって、次のコードを使用できます。

var append_element = '<span></span>';
    $('.slider-range').slider( {
        animate : true,
    });

    $("#opacity").slider({
        min     : 0,
        max     : 100,
        value   : 60,
        step    : 10,
        change  : function(event, ui) {
            slider_value('#opacity', ui.value);
        }
    });

    $("#volume").slider({
        min     : 0,
        max     : 100,
        value   : 20,
        step    : 10,
        change  : function(event, ui) {
            slider_value('#volume', ui.value);
        }
    });

    function slider_value(id, response) {
        $(id).html(append_element);
        //remove '#' / get id
        id = $(id).attr('id');

        var new_span = $('#'+id+'>span').addClass('slider-value-'+id);
        $(new_span).html(response);
        console.log(new_span);
    }

例: http://jsfiddle.net/c7myp/

于 2012-07-20T10:37:13.627 に答える