5

jQuery UI Tabsを使用しているページがあり、Ajax を介して各タブのコンテンツを読み込んでいますが、問題は、タブのコンテンツでボタン (私はjQuery ui ボタンを使用しています) すべての jquery ui クラスを失います。つまり、次のことを意味します。

ページが初めて読み込まれるとき、ボタンは次のようになります。

<button class="my_button ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only">
<span class="ui-button-icon-primary ui-icon ui-icon-plusthick"></span>
</button>

ご覧のとおり、私のボタンにはすべての jquery-ui クラスがありますui-button, ui-widget, etc...。また、私のボタンには、ボタンのラベルとしてプラス (+) 記号を表示するスパンがあります。したがって、私のボタンは正しく表示されます。

しかし、Ajax 経由で同じコンテンツ (同じボタンを含む) をロードすると、ボタンは次のようになります。

<button class="my_button"></button>

ご覧のとおり、ボタンの jQuery UI クラスがすべて失われています。したがって、ボタンはスタイルされていません

どうすればこれを修正できますか?

: これらの jquery-ui クラスを HTML のボタンに手動で追加していないことに注意してください。jQueryを使用してボタンを初期化すると$(".my_button").button();、jQuery は必要なすべての jquery-ui クラスをボタンに適切に適用します。ですから、事前に jquery-ui クラスをボタンに割り当てなかったからだと言わないでください (そうする必要はありません)。また、私は.live().delegate( ) を試しましたが、どれもうまくいきませんでした。

誰でもこれで私を助けてください

ありがとうございました

4

1 に答える 1

4

私はこの問題に一度直面し、次のような document.ready 呼び出しを使用してこの問題を解決しました

function myreadyFunc(){
    $(".my_button").button();
    // Other codes
}

次のような document.ready がありました

$(document).ready(function(){
    myreadyFunc();
});

各 ajax (成功) 呼び出しの後、私は呼び出していました

myreadyFunc();

これがあなたにも役立つことを願っています。このアプローチを使用して、各 ajax 呼び出しの後に document.ready を呼び出すことでは不可能だった document.ready のコードを実行しました。

于 2012-02-25T15:46:33.983 に答える