2

多くの調査の結果、州内へbindingのscrollイベントはサポートされていないことがわかりました。これは問題ありませんが、現在取り組んでいるスクリプトに関して 1 つまたは 2 つの質問があります。$(window)live

HTML5 jQuery 履歴プラグイン (http://tkyk.github.com/jquery-history-plugin/) を利用してページをロードし、サイト内にオーディオ プレーヤーが固定されているため、滑らかなユーザー エクスペリエンスを提供する Web サイトがあります。

私のページの 1 つで、ウィンドウのスクロール時にアルバムにロードするための無限スクロールを作成しました。ページに直接アクセスすると問題なく動作しますが、HTML5 対応のリンク (HTML5 実装専用のリンクがいくつかあります) 経由でアクセスすると機能しません。

ここに私の無限スクロールコードがあります:

jQuery(function() {
                var getMoreMedias, loading, mediaType, nearBottomofPage, page, pendingCall, genreType, url, did_scroll;
              page = 1;
              loading = false;
                // did_scroll = false
              mediaType = $('.breadcrumbs strong').attr('rel');
                genreType = $('.breadcrumbs strong').data('genre-id')

              nearBottomofPage = function() {
                return $(window).scrollTop() > $(document).height() - $(window).height() - $('#footer').height();
              };

              getMoreMedias = function(page, mediaType) {
                    opts = {
                     lines: 12, //The number of lines to draw
                     length: 7, //The length of each line
                     width: 3, //The line thickness
                     radius: 10, //The radius of the inner circle
                     color: '#000', // #rgb or #rrggbb
                     speed: 1, //Rounds per second
                     trail: 60, // Afterglow percentage
                     shadow: true //Whether to render a shadow
                    };

                    var spinner = new Spinner(opts).spin()

                    $('#loadingMore').append(spinner.el)

                    url = '/top_medias/'
                    url += mediaType

                    if(genreType)
                        url += '/' + genreType

                    url += '?page=' + page

                $.ajax({
                        cache: false,
                  url: url,
                  type: 'get',
                  dataType: 'script',
                  success: function(data) {
                    $('#loadingMore').html('');
                            loading = false
                  },
                        error: function() {
                            $('#loadingMore').html('<p>No more results could be found</p>')
                            loading = false
                        }
                });
              };

            $(window).scroll(function(){
                    did_scroll = true
            })

            setInterval(function(){
                if(did_scroll) {
                    if (loading) return;
                if (nearBottomofPage()) {
                      loading = true;
                      page++;
                        getMoreMedias(page, mediaType)
                        did_scroll = false
                }
                }
            }, 250)
        });

ページがAjax経由でアクセスされた場合（これはHTML5プラグインが本質的に行うことです）、上記のものを取得して機能させる方法はありますか？

4

1 に答える 1

2

これで問題が解決するかどうかはわかりませんが、「ブラウズすると機能しますが、Ajax で読み込むと機能しません」というステートメントがフラグを立てました。Javascript は Ajax で読み込まれたページでは実行されずeval()、Javascript を評価する必要があります。

この機能が必要なときに私がすることは、非表示<div>の Javascript を追加することです (`' タグなしで、読み込み後にそれを実行します (疑似コード)

$.ajax(url, success: function() { eval($('#ajax').html(); });

<div id="ajax" style="display:none"> alert('here'); </div>
于 2011-12-01T17:49:30.883 に答える