私たちのプロジェクト用にライブテーマピッカーを構築していますが、うまくいきます。それは素晴らしいことです!しかし、解決できないバグが 1 つ残っており、気が狂いそうになります。
これが問題です。テーマ ピッカー ページをロードする瞬間に、バックボーン アプリ (Backbone JS、Underscore JS、および jQuery でビルドされています) が開始されます。初期化時に、アプリはいくつかのことを調べます。そのうちの 1 つは、現在のテーマにどのカラー セットを使用する必要があるかです (現在のテーマ設定は DB に保存されています)。
これは、初期化時に呼び出される関数です。
// Select the colorset for the first time a new theme is picked
selectColorset: function( newTheme ) {
// Check or this is a new theme or not
var themeCheck = ( typeof newTheme !== "undefined" ) ? true : false,
colorset = ( !themeCheck ) ? parseInt( $("#js-colorset-input").val() , 10 ) : 0;
// Select the right list
$("#js-theme-colors ul").eq( colorset ).addClass("selected-set");
this.renderColorStyle( colorset );
}
ご覧のとおり、この関数は 2 つの方法で使用されます。最初は初期化時と、別のテーマに切り替えるときです。
最初に調べます。なぜこの関数が呼び出されるのですか? 変更イベントで呼び出されるか、初期化で呼び出されます。初期化時に呼び出された場合、newTheme 変数はデータを保持しません。
初期化時のカラー セット番号は、ページの非表示フィールドの番号になります。カラーセット番号を取得したので、カラーセットのスタイルシート (this.renderColorStyle( colorset )) をレンダリングできます。
// Insert the color stylesheet
renderColorStyle: function( colorset ) {
// Check or the colorset is given
if( typeof colorset === "undefined" || colorset === "" ) {
colorset = 0;
}
// Define the stylesheet for this theme
if( $("#js-theme-iframe").contents().find("#js-theme-colorset").length > 0 ) {
// Change the current stylesheet
$("#js-theme-iframe")
.contents()
.find("head #js-theme-colorset")
.attr("href", "stylesheets/themes/theme-" + this.themeID + "/theme-color-" + colorset + ".css");
} else {
// Insert a new stylesheet
var stylesheet = $("<link />", {
href: "stylesheets/themes/theme-" + this.themeID + "/theme-color-" + colorset + ".css",
rel: "stylesheet",
id: "js-theme-colorset"
});
// Append the stylesheet to the iframe
$("#js-theme-iframe").contents().find("head").append( stylesheet );
}
}
ご覧のとおり、最初にカラー セットを確認するか (念のため)、初期化時にカラー セット スタイルシートがないため、作成します。これは jQuery で行われます。ご覧のとおり、href、rel、および id (カラー セット スタイルシートの検索に使用) を使用して要素を作成しています。
しかし、jQueryは初期化時に空の配列を返し続けます..スタイルシートはありません..すべてのデータがそこにあり、console.log()関数を使用して表示するか、データが実際にある場合は、です。それだけではありません。
しかし、なぜこれが起こるのか、私には本当にわかりません。テーマの変更でこれらの関数を呼び出すと、すべてが機能し、jQuery がスタイルシートを作成するためです..したがって、初期化時にのみ機能せず、気が狂います..
毎回まったく同じ関数が呼び出される可能性があることを誰かが説明してくれることを願っていますが、初期化時には、テーマの変更時とは別の出力 (同じ数値と変数) があります..