Cakephp: multiply jquery 绑定冲突

Cakephp: multiply jquery binds conflict

我在一个页面上放置了几个 jquery 滑块、一些复选框和单选按钮。

I post 是在滑动停止、更改复选框、更改或单选按钮时创建的。这很好用。

在同一页面上有一个 table 显示了此信息,在出站链接的按钮中,我放置了 id posted 到另一个控制器以跟踪出站点击与他们的身份证。

单击按钮时,使用 jquery 到此点击控制器完成带有 ID 的 post。

这在不使用滑块、复选框、单选按钮时效果很好。一旦触摸其中一个元素,按钮上的此点击控制器的 post 就不再起作用。

这是 javascript 的样子:

    <script type="text/javascript">
    //<![CDATA[
        $(document).ready(function () {
            $(".btn").bind("click", function (event) {
                $.ajax({
                    async: true,
                    data: "id=" + $(this).attr("id"),
                    dataType: "html",
                    type: "POST",
                    url: "\/clicks"
                });
                return false;
            });
        $("#saveForm").bind("slideStop", function (event) {
            $.ajax({
                async:true, 
                beforeSend:function (XMLHttpRequest) {
                    $("#loading").attr("style", " ")
                }, 
                complete:function (XMLHttpRequest, textStatus) {
                    $("#loading").attr("style", "display:none")
                }, 
                data:$("#saveForm").serialize(), 
                dataType:"html", 
                success:function (data, textStatus) {
                    $("#resultaat").html(data);
                }, 
                type:"POST", 
                url:"\/abonnements"
            });
            return false;
        });
        $(".checkbox").bind("change", function (event) {
            $.ajax({
                async:true, 
                beforeSend:function (XMLHttpRequest) {
                    $("#loading").attr("style", " ")
                },    
                complete:function (XMLHttpRequest, textStatus) {
                    $("#loading").attr("style", "display:none")
                }, 
                data:$("#saveForm").serialize(), 
                dataType:"html", 
                success:function (data, textStatus) {
                    $("#resultaat").html(data);
                }, 
                type:"POST", 
                url:"\/abonnements"
            });
            return false;
        });
        $(".radio").bind("change", function (event) {
            $.ajax({
                async:true, 
                beforeSend:function (XMLHttpRequest) {
                    $("#loading").attr("style", " ")
                }, 
                complete:function (XMLHttpRequest, textStatus) {
                    $("#loading").attr("style", "display:none")
                }, 
                data:$("#saveForm").serialize(), 
                dataType:"html", 
                success:function (data, textStatus) {
                    $("#resultaat").html(data);
                }, 
                type:"POST", 
                url:"\/abonnements"
            });
            return false;
        });
    });
    //]]>
</script>    

我认为这是由同一页面上的多个 post 引起的,但我不确定。我一整天都在尝试解决这个问题,但找不到解决方案。

更新:

我找到了导致其他功能失败的原因。

    $this->Js->get('#saveForm')->event(
                'slideStop',
                $this->Js->request(
                array('action' => 'index', 'controller' => 'abonnements'),
                array(
                    'update' => '#resultaat',
                    'data' => $data,
                    'async' => true,    
                    'dataExpression'=>true,
                    'method' => 'POST',
                    'before'   => '$("#loading").attr("style", " ")', 
                    'complete' => '$("#loading").attr("style", "display:none")'
                    ))
                );

#resultaat table 中显示的 .btn 操作在 slideStop 操作完成更新时被破坏。

按钮是这样的:

<td>
    <?php echo $this->Html->link('Meer Info',
            $link,
            array('class' => 'btn btn-primary btn-block', 
                    'target' => '_blank', 
                    'id' => $abonnement['Abonnement']['id']
                )
        ); 
    ?> 
</td>

需要id。

我已通过将按钮单击的 jquery 代码放置在由另一个 jquery 函数更新的元素上来解决此问题。当滑块更新放置另一个绑定的元素时,它以某种方式丢失了绑定。