javascript - ajaxロード後にjquery appendを使用しようとしています

Question

列名がクリックされたときにテーブルの行を並べ替えるスクリプトがあります。

テーブルがどの列でソートされているかを示すためにクリックされた列名の末尾に三角形を追加したいと考えています。

<script>
    $(document).ready(function(){
        $('.data-table a').click(function(){
            var el = $(this);
            $('body').load('http://mysite.com/index.php/site/table/index/' + $(this).attr('id')).ajaxComplete(function(){
                el.append('&#9650;');
            });
           return false;
        });
    });
</script>

テーブルは正しく並べ替えられますが、列名の末尾に HTML エンティティを追加できません。

どうすればこれを行うことができますか？

Answer 1

そのloadステートメントで「body」要素を殺しています。次のようなことを試してください：

<script>
    $(document).ready(function(){
        $('.data-table a').click(function(){
            var el = $(this);
            $('#target_element').load('http://mysite.com/index.php/site/table/index/' + $(this).attr('id')).ajaxComplete(function(){
                el.append('&#9650;');
            });
           return false;
        });
    });
</script>

ここで、「#target_element」は、コンテンツが ajax リクエストの結果に置き換えられるコンテンツ内の場所を指します。