0

現在、jquery appendTo を使用して写真とテキストを div にロードしています。クリックするたびに、追加されているものを単にリロードするようにしようとしていますが、代わりに、古い要素をクリアして新しい要素をロードするのではなく、新しい要素を追加し続けます。私の機能は現在次のようになっています。

   function load_new() {

   $.getJSON('images.json', function(data) {
    var $item = data.images[Math.floor(Math.random()*data.images.length)];

    var $image = $('<script id="scripty"> $.backstretch("' + $item.image + '", {speed: 1200}); </script>');
    var $caption = $('<h1>' + $item.caption + '</h1>');

    $image.appendTo('body');
    $caption.appendTo('.text');


        });
};

どんな助けでも大歓迎です!!!

4

2 に答える 2

1

よくわかりませんが、コンテナ内の既存の要素の後にコンテナ内に新しい要素を追加します。コンテンツを置き換えたい場合は、使用する必要があります$(element).html(newContent)

于 2013-09-01T22:14:20.580 に答える
1

私はあなたの構造を違うものにします。次のような構造にすることができます。

<body>
    <div id="image"></div>
    <div class="text">

        <div class="append-text"></div>
    </div>
</body>

そして、関数は次のようになります。

function load_new() {

   $.getJSON('images.json', function(data) {
    var $item = data.images[Math.floor(Math.random()*data.images.length)];

    var $image = $('<script id="scripty"> $.backstretch("' + $item.image + '", {speed: 1200}); </script>');
    var $caption = $('<h1>' + $item.caption + '</h1>');

    $('#image').html($image);
    $('.append-text').html($caption);

}

次に、更新時にコンテンツを表示したい場所に div を再配置します。

于 2013-09-01T22:16:52.450 に答える