2

内部にスライディングボックスを備えたこれらのウィジェットがあります。ページが読み込まれると 2 つのウィジェットがありますが、ウィジェットを追加して再度削除することができます。

スライディング ボックスの内側にはカラー ピッカーがあり、スターター ウィジェットではカラー ピッカーが正しく機能しますが、追加されたウィジェットではカラー ピッカーが機能しません。

このフィドルを参照してください：http://jsfiddle.net/fULQZ/

エラーはカラーピッカーのスクリプトにあると思いますか?

カラーピッカーのスクリプトは次のとおりです。

// Color picker
function updateBackground(color) {
    $(this).parents(".box_header").css("background", color.toHexString());
}


$(function() {


$(".flatPalette").spectrum({
    flat: true,
    showInput: true,
    showPaletteOnly: true,
    showPalette:true,
    maxPaletteSize: 10,
    palette: [
         ['#DDD','#9fd0d3', '#c9a9d1', '#e2a6a5', '#c2d2bd','#9fb2d1', '#dbba97', '#cbefe9', '#e6e8bf'],
        []
    ],
    change: updateBackground
});


});
4

2 に答える 2

1

専用の関数でスペクトル初期化を抽出し、セレクターを少し変更して初期化されていないものをすべて取得し、gridster.add_widget の後にこの関数を呼び出すだけです

function addSpectrum(){
    $(".flatPalette:empty").spectrum({ ... }); // :empty will get non init box
};

$('.addbox').on("click", function(){
    gridster.add_widget(' ... ', 2, 1);
    addSpectrum(); // add spectrum on the new box
});

addSpectrum(); // init spectrum on non dynamic box

http://jsfiddle.net/fULQZ/1/

于 2013-03-05T13:18:56.830 に答える
0

実行時に追加された要素と一致する「ライブ」セレクターが必要です。http：//api.jquery.com/live/を確認してください。

于 2013-03-05T11:45:28.050 に答える