javascript で作成した div 内でjQuery タブ ( http://jsfiddle.net/43FcS/2/ )を使用したいと考えています。
現在、私が働いているショップのショップロケーターを作成しています。Bjorn ( http://www.bjornblog.com/web/jquery-store-locator-plugin ) によって作成された jQuery ショップ ロケーター プラグインを使用しています。
ユーザーが検索をクリックすると、検索結果 (入力した住所に最も近い 4 つのショップ) がリストされます。各liで、クラス「shoptab」でdivを作成することを考えました。上記のリンクのように、各 div に 2 つのタブ (住所と営業時間) を表示したいと考えています。私のjavascriptは、次の関数でliを作成します:
$('<li />').html("<div class=\"shoptab\"><h2 class=\"loc-name\"> Shop " + storeName + "<\/h2> <ul><li><a href=\"#tabs-1\">Address<\/a><\/li> <li><a href=\"#tabs-2\">Opening hours<\/a><\/li><\/ul> <div id=\"tabs-1\"><p>" + storeAddress1 + "<\/p> <p>" + storeAddress2 + "<\/p> <p>" + storeCity + ", " + storeState + " " + storeZip + "<\/p> <p>" + storePhone + "<\/p> <\/div> <div id=\"tabs-2\"><p>" + storeHours1 + "<\/p> <p>" + storeHours2 + "<\/p> <p>" + storeHours3 + "<\/p> <\/div><\/div>")
ID tabs-1 と tabs-2 は数回使用されるため使用できないことはわかっていますが、今のところ、少なくともそれらを表示してから、コードを調整して div の ID 1、2、3、 4等
jQuery タブへの私の関数は、私の shoplocator 関数と一緒にドキュメントの一番下に書かれています。
$(function() {
$(".shoptab").tabs();
});
jQuery ui スクリプトは、クラスを shoptab div と ul/li 内に適用しないため、それを機能させる方法がわかりません。
この情報であなたが私を助けてくれることを願っています。