堆栈内存溢出
  繁体   English   中英

使用Infinite Ajax Scroll时的jQuery函数

[英]jQuery function when using Infinite Ajax Scroll

 原文  2016-05-26 20:03:04  1   1    javascript/ php/ jquery/ ajax

问题描述

如果我特定于示例选项“ dead”，那么我就获得了带有选项和jQuery的Filter，它仅显示具有Status：dead;的行。 但是当我向下滚动并触发无限的Ajax滚动时，数据库中的新数据不仅显示了Status：dead。的行，还可以保存要用于Ajax滚动的新页面的过滤器

我的密码 

    <script type="text/javascript">
  $(document).ready(function() {
    // Infinite Ajax Scroll configuration
    jQuery.ias({
      container : '.wrap', // main container where data goes to append
      item: '.item', // single items
      pagination: '.nav', // page navigation
      next: '.nav a', // next page selector
      loader: '<img src="css/ajax-loader.gif"/>', // loading gif
      triggerPageThreshold: 5 // show load more if scroll more than this
    });
  });
</script>
<script>
function replaceQueryParam(param, newval, search) {
    var regex = new RegExp("([?;&])" + param + "[^&;]*[;&]?");
    var query = search.replace(regex, "$1").replace(/&$/, '');

    return (query.length > 2 ? query + "&" : "?") + (newval ? param + "=" + newval : '');
}
$(window).load(function() {
  $('#select_box').change(function() {
    if($(this).val() == 'notresolved') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:contains('Разрешен')").hide();
    }
    if($(this).val() == 'new') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Нов'))").hide();
    }
    if($(this).val() == 'opened') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Отворен'))").hide();
    }
    if($(this).val() == 'resolved') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Разрешен'))").hide();
    }
    if($(this).val() == 'dead') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Dead'))").hide();
    }

    if($(this).val() == 'all') {
      $( '#table-tbody #table-tr').show();
    }
  });
    $('#queue_box').change(function() {
    if($(this).val() == 'mitev') {
      window.location = 'test1.php' + replaceQueryParam('quid', 5, window.location.search)
    }
    if($(this).val() == 'all') {
      window.location = 'test1.php' + replaceQueryParam('quid', -1, window.location.search)
    }
    if($(this).val() == 'office') {
      window.location = 'test1.php' + replaceQueryParam('quid', 6, window.location.search)
    }
    if($(this).val() == 'support_c') {
      window.location = 'test1.php' + replaceQueryParam('quid', 2, window.location.search)
    }
    if($(this).val() == 'clients') {
      window.location = 'test1.php' + replaceQueryParam('quid', 8, window.location.search)
    }
    if($(this).val() == 'mtel') {
      window.location = 'test1.php' + replaceQueryParam('quid', 10, window.location.search)
    }
    if($(this).val() == 'ro-ni') {
      window.location = 'test1.php' + replaceQueryParam('quid', 11, window.location.search)
    }
  });
});

$(function() {
    if (localStorage.getItem('queue_box')) {
        $("#queue_box option").eq(localStorage.getItem('queue_box')).prop('selected', true);
    }

    $("#queue_box").on('change', function() {
        localStorage.setItem('queue_box', $('option:selected', this).index());
    });

});

</script>
</head>
<body>
<?php 
 session_start();
    if(!isset($_SESSION['customer_id']) && empty($_SESSION['customer_id'])) {
        header("Location: login.php");
    }
?>
<div id="wrapper">
  <div id="header">
  <h1><a href="index.php" style="text-decoration:none;color:#039;">Ticket system</a></h1>
    <div style="text-align:left;vertical-align:bottom;">
    <img src="images/save.gif" /><a href="addticket.php" style="text-decoration:none;color:#039;">New Ticket</a>
    </div>
  </div>
  <div id="filter">
  <!--Нови: <input type="checkbox" id="check_box1">
  Разрешени: <input type="checkbox" id="check_box2">
  Отворени: <input type="checkbox" id="check_box3"> 
  Неразрешени: <input type="checkbox" id="check_box4">  -->
  Queue: <select id="queue_box" style="height:35px;">
    <option value="all" selected="selected">- всички -</option>
    <option value="mitev"> Стойчо Митев</option>
    <option value="office"> Офис & инфо</option>
    <option value="support_c"> Поддръжка Клиенти</option>
    <option value="clients"> Клиенти</option>
    <option value="mtel"> Огледи Мтел</option>
    <option value="ro-ni"> Поддръжка Ро-Ни</option>
  </select><br>
  Статус: <select id="select_box" style="height:35px;">
    <option value="all">- всички -</option>
    <option value="new">нов</option>
    <option value="opened">отворени</option>
    <option value="resolved">разрешени</option>
    <option value="dead">dead</option>
    <option value="notresolved">неразрешени</option>
  </select>
  </div>



i was thinking of something like this 

`ias.on('load', function(event) {
    if($("#select_box").val() == 'notresolved') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:contains('Разрешен')").hide();
    }
    if($("#select_box").val() == 'new') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Нов'))").hide();
    }
    if($("#select_box").val() == 'opened') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Отворен'))").hide();
    }
    if($("#select_box").val() == 'resolved') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Разрешен'))").hide();
    }
    if($("#select_box").val() == 'dead') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Dead'))").hide();
    }

    if($("#select_box").val() == 'all') {
      $( '#table-tbody #table-tr').show();
    }
  });`

我在想这样的事情，你会说什么

1 个解决方案

解决方案1
 1 已采纳  2016-05-26 21:06:37

我找不到允许ias()使用其他参数的任何内容，因此我只能建议（例如在触发某些事件之后）持续使用（现在可能不是最好的解决方案） $('#select_box').change(function()您现在使用的$('#select_box').change(function() 。如果我在ias()缺少某些内容，请通知我。

例： 

$(document).ready(function() {
  // Infinite Ajax Scroll configuration
  jQuery.ias({
    container : '.wrap', // main container where data goes to append
    item: '.item', // single items
    pagination: '.nav', // page navigation
    next: '.nav a', // next page selector
    loader: '<img src="css/ajax-loader.gif"/>', // loading gif
    triggerPageThreshold: 5, // show load more if scroll more than this
    onLoadItems: apply_changes()
    // OR:
    onLoadItems: function(items) {
        // Paste everything that function apply_changes() has.
    }
}
});

function apply_changes()
{
    if($('#select_box').val() == 'notresolved') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:contains('Разрешен')").hide();
    }
    if($('#select_box').val() == 'new') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Нов'))").hide();
    }
    if($('#select_box').val() == 'opened') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Отворен'))").hide();
    }
    if($('#select_box').val() == 'resolved') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Разрешен'))").hide();
    }
    if($('#select_box').val() == 'dead') {
      $( '#table-tbody #table-tr').show();
      $( "#table-tbody #table-tr:not(:contains('Dead'))").hide();
    }

    if($('#select_box').val() == 'all') {
      $( '#table-tbody #table-tr').show();
    }
}

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 无限滚动ajax jquery jQuery / ajax无限滚动事件 使用Ajax轻松实现无限滚动jQuery 使用ajax进行无限滚动的性能 使用Ajax在Symfony中无限滚动 使用wordpress jetpack无限滚动时其他Ajax脚本会挂起 无限滚动，回调jquery函数 jQuery ajax无限滚动排除页脚高度 jQuery无限滚动触发多个Ajax请求 jQuery-无限滚动设置标头ajax分页
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM