0

我有无限滚动设置，因此当浏览器点击此代码时：

     <nav id='page-nav'>
            <a href='http://localhost:8888/plum/_pages/feeds_gen/feed2.php'></a>
    </nav>

它将加载每个连续的 feed2.php，然后是 feed3.php，然后是 feed4.php 等，直到给定目录中没有更多的 feed?.php 文件。这是无限滚动javascript：

$container.infinitescroll({
          navSelector  : '#page-nav',    
          nextSelector : '#page-nav a', 
          itemSelector : '.item',
          animate      : false,
          loading: {
              msgText: '<i class="icon-th loadingicon"><p style="font-size:12px; font-family: Georgia,"Times New Roman",Times,serif;">loading...</p> </i>',
              finishedMsg: '<i class="icon-ok loadingicon"><p style="font-size:12px; font-family: Georgia,"Times New Roman",Times,serif;">loaded</p></i>',
              img: 'images/blank.png'
            }
          },

最后这里是 modal 的 html ：

    <div class='yo'> 
        <div id='article6e96d894690f0b8189684405c57840c0' class='modal hide fade in bigModal' style='display: none;'>  
            <div class='modal-header'>  
                <a class='close' data-dismiss='modal'>×</a>  
                <h3>New Tax Code Most Progressive Since 1979. </h3>  
            </div>  
    <div class='modal-body'>   
        <p> 6 Jan 2013 | 9:00 pm CET</p>    
        Tax Code May Be the Most Progressive Since 1979<div readability="80"><p>Republicans resisted increasing tax rates and aimed for lower revenue targets, arguing that spending was the budget's prvere income-tax burden for people at a low level of income. It was actually kind of appalling," said Alan D. Viard, a tax expert at the American Enterprise Institute, a right-of-center research group in Washington. "Policy makers in both parties realized that was bad policy and started whittling away at it" by expanding credits and tinkering with tax rates.</p><p>After those changes and the new law, comparing average tax rates for poor households and wealthy households, 2013 might be the most progressive tax code since 1979. But economists cautioned that measuring progressivity is tricky. "It's not like there is some scientific measure of progressivity all economists agreed upon," said Leonard E. Burman, a professor of public affairs at Syracuse University. "People look at different numerical measures and they've changed in different ways at different income levels."</p><p>Mr. Viard said that over time the code had become markedly rich, even if I'm getting taxed much more than a low-income person" would be, Mr. Williams of the Tax Policy Center added.</p></div><a href='http://t.co/m6inGvk6' class='btn btn-success'>Source</a>  
    <a href='#' class='btn' data-dismiss='modal'>Close</a>

    </div>  

</div> <!--END YO -->

这是启动模态框的 HTML：

 <a data-toggle='modal' id='article_button2' href='#article6e96d894690f0b8189684405c57840c0' >New Tax Code Most Progressive Since 1979.</a>

所以，基本上当你点击<a data-toggle='modal' id='article_button2' href='#article6e96d894690f0b8189684405c57840c0' >New Tax Code Most Progressive Since 1979.</a>

然后模态应该弹出。我遇到的问题是<nav>模式加载的任何页面都不会加载，但问题是 HTML 在所有 feed2.php feed3.php 等上的顺序都是正确的。

当无限滚动加载 feed2.php 时，是否有其他方法可以使模式出现？

提前感谢大家的耐心和帮助！

4

2 回答 2

0

嘿，你可以试试

 <script>
jQuery(document).ready(function($){
$(".post").infinitescroll({

    loading: {
        img: "<?php echo get_template_directory_uri(); ?>/images/loading.gif",
    },
    "nextSelector":"#nav-below .nav-previous a",
    "navSelector":"#nav-below",
    "itemSelector":".post",
    "contentSelector":"#content"
}, function(newElements){ 
  //callback
$('[data-toggle="modal"]').on('click', function(event){
event.preventDefault()
    // update modal header with contents of button that invoked the modal
    $('#myModalLabel').html( $(this).html() );
    //fixes a bootstrap bug that prevents a modal from being reused
    $('#utility_body').html('<div class="loading"></div>').load(
        $(this).attr('href'),
        function(response, status, xhr) {
            if (status === 'error') {
                //console.log('got here');
                $('#utility_body').html('<p>Sorry, but there was an error:' + xhr.status + ' ' + xhr.statusText+ '</p>');
            }
            return this;
        }

    );
});
}
);
});
</script>

我正在输入加载代码以在无限滚动时回调函数。希望我的答案对你来说没有过期:)

于 2013-04-25T15:55:44.223 回答
0

I Wayan Widyana 的另一个答案是一个很好的答案，它引导我解决我的问题，这或多或少与描述的相同。

基本上，在 Infinite Scroll 中的 jQuery 加载事件之后，Bootstrap 模态的 javascript 设置代码需要重新初始化。这是通过使用 Infinite Scrolls 的可选回调重新运行初始模式设置代码来完成的，该回调（显然）在成功加载新内容时被触发。

可以在此处找到有关此的更多信息：

http://www.infinite-scroll.com/infinite-scroll-jquery-plugin/

于 2013-06-16T09:00:26.230 回答