jquery - 复选框在 10 个结果后不会触发带数据表插件的 jquery 函数

标签 jquery jquery-plugins

感谢您的阅读。

我使用datatable我的网站的插件用于显示数据库中的一些数据。我还有一个我编写的用于更新数据库的小型 jquery ajax 插件。问题是数据表在每页/集上显示 10。在前 10 个结果中,如果您使用开/关开关(复选框),它会触发我编写的 ajax jquery 函数,但如果您转到第二页/设置或显示超过 10 个,则开/关开关(复选框)不会触发jquery。控制台中没有任何反应。

Here is the site that I'm working on.

这是复选框触发的jquery代码

<script>

jQuery(document).ready(function($){

 $(".community-check").change(function(event) {

    var Tag = $(this).val();

    $.ajax({
      url: "/ajax.php?Page=subscribe",
      type: "POST",
      dataType: "json",
      data: {Tag:Tag},
      success: function(data, textStatus){
      if(data.status == 'true'){
         return true;
      }else{
         alert( data.message );
         return false;
      }
    },
    error:function(){
      alert('error');
    }
  });
});
});
</script>

jquery 数据表

<script>
    jQuery(function($) {
        var colorbox_params = {
            reposition:true,
            scalePhotos:true,
            scrolling:false,
            previous:'<i class="icon-arrow-left"></i>',
            next:'<i class="icon-arrow-right"></i>',
            close:'&times;',
            current:'{current} of {total}',
            maxWidth:'100%',
            maxHeight:'100%',
            onOpen:function(){
                document.body.style.overflow = 'hidden';
            },
            onClosed:function(){
                document.body.style.overflow = 'auto';
            },
            onComplete:function(){
                $.colorbox.resize();
            }
        };

        $('[data-rel=popover]').popover({container: 'body',html:true});

        $('#community-table').dataTable( {
            "oLanguage": {
                "sLengthMenu": "_MENU_ adet kayıt göster",
                "sZeroRecords": "Boş",
                "sInfo": "Sonuç _START_ ile _END_ arası _TOTAL_ kayıt",
                "sInfoEmpty": "Gösterilen 0 ile 0 arası 0 kayıt",
                "sInfoFiltered": "(_MAX_ etiket içinden)",
                "sProcessing": "Arıyor...",
                "sSearch": "Ara:",
                "sLoadingRecords":"Yükleniyor..."
            }
        });
    });
</script>

表格 html

  <html>
     <div class="col-xs-12">
            <div class="table-header">
                Sessions
            </div>
            <div class="table-responsive">
                <table id="session-table" class="table table-striped table-bordered table-hover">
                    <thead>
                        <tr>
                            <label>
                            <input name="Tag" class="ace ace-switch ace-switch-6 community-check" value="'.$ROW['Tag'].'" type="checkbox" '.($ROW['Joined'] == $_SESSION['UserID'] ? 'checked' : '').'/>
                            <span class="lbl"></span>
                            </label>
                        </tr>
                    </thead>
                    <tbody>
                      <tr>
                      <td></td>
                      </tr>
                    </tbody>
                </table>
            </div>
        </div>
 </html>

http://www.buyuyenicerik.com/Sources/JavaScript/jquery.dataTables.min.js http://www.buyuyenicerik.com/Sources/JavaScript/jquery.dataTables.bootstrap.js

最佳答案

委托(delegate)事件使用.on()方法将其绑定(bind)在TABLE级别,这是一个静态容器:

$('#community-table').on("change", ".community-check", function(event) {...});

关于jquery - 复选框在 10 个结果后不会触发带数据表插件的 jquery 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20218141/

相关文章:

jquery - json数据jquery.append格式化问题

javascript - 如何在不访问 html 的情况下将 ng-app 添加到 html 元素

jquery - 如何在条件jquery验证插件中显示消息

javascript - 未显示颜色框的内联内容

javascript - jQuery 更改我的 <span> 内的文本

jquery - 页脚顶部位置在主页上较小,但在其他页面上正常大小

javascript - 当用户指定数量时动态克隆元素? - JavaScript + HTML

jquery-plugins - 使用 jQuery 和 Pixastic 去饱和效果

jquery - div 与窗口相关的顶部位置

javascript - JQuery 星级评分插件 - 投票提交后禁用