AJAXがスタイルをロードしないことに関する他の同様の質問への回答を確認しました。解決策はどれもうまくいきませんでした。
AJAX 呼び出し内で、別の AJAX 呼び出しをページの要素にロードしています。
$.ajax({
url: site_url+'/ajax/int_rooms'
}).done(function (data) {
$('.rooms-sides').append(data);
});
私も試しました$('.rooms-sides').load(site_url+'/ajax/int_rooms');
HTML を取得してページに手動で配置すると、スタイルが設定され、期待どおりに表示されます。それを取得してAJAX（正常にロードされている）に貼り付けると、正しくフォーマットされなくなりました。
コンソールにエラーはありません。Chrome を使用しています (Firefox でも同じ結果になります)。「要素を調べる」と、ロードされたファイルが のようなテーブル タグを失っているよう<tr>に見えますが、Chrome 開発者ツールのネットワーク タブからの応答を表示すると、実際にはテーブル タグが返されていることがわかります。
繰り返しますが、すべてがプラグインされているメインファイルでhtmlを同じように使用すると、完全に機能します。
この HTML は、出力される php 変数に入れられているため、$r->name が表示されます。ファイル内のphp出力ではなく、HTMLだけに入れてみましたが、まったく同じエラーが発生します。
問題の HTML:
<input type='hidden' id='room_name' value='$r->name'/>
<tr>
<td class="action"><a href="#" title="Delete"><span class="delete">Delete</span></td>
<td class="action"><a href="#" title="Duplicate"><span class="duplicate">Duplicate</span></td>
<td><a href="#" title="Configure">Configure</td>
<td>
<div class="ui-widget">
<select id="combobox">
<option value="">Select one...</option>
<option value="Kitchen">Kitchen</option>
<option value="Bedroom">Bedroom</option>
<option value="Living Room">Living Room</option>
<option value="Dining Room">Dining Room</option>
<option value="Hallway">Hallway</option>
</select>
</div>
</td>
<td>$364.14</td>
</tr>
<script type="text/javascript">
$("#room_name").remove();
</script>