Fatal编程技术网
  • ajax/
  • Ajax请求的数量随着实时jQuery的增加而增加

Ajax请求的数量随着实时jQuery的增加而增加

ajax jquery

Ajax请求的数量随着实时jQuery的增加而增加,ajax,jquery-ui-dialog,jquery,Ajax,Jquery Ui Dialog,Jquery,我有下面使用的代码clone（）和live（）。 代码被加载到带有链接的jQuery UI对话框中。 每当我点击链接，它就会转到服务器并用下面的代码填充对话框。 第一次加载页面时，它可以正常工作，但是如果我关闭对话框并再次单击链接以获取对话框，则发送的Ajax请求数量会增加 第一次发送触发更改时，我只发送一个请求，我关闭对话框并再次加载它，然后触发更改，它同时发送两个Ajax请求，第三次同时发送三个请求，依此类推 你认为我的问题在哪里 <input id="TaskId" name="Ta

我有下面使用的代码
clone（）
和
live（）
。 代码被加载到带有链接的jQuery UI对话框中。 每当我点击链接，它就会转到服务器并用下面的代码填充对话框。 第一次加载页面时，它可以正常工作，但是如果我关闭对话框并再次单击链接以获取对话框，则发送的Ajax请求数量会增加

第一次发送触发更改时，我只发送一个请求，我关闭对话框并再次加载它，然后触发更改，它同时发送两个Ajax请求，第三次同时发送三个请求，依此类推

你认为我的问题在哪里

<input id="TaskId" name="TaskId" type="hidden" value="18" />
<div id="MainDiv">
    <div id="toClone">
        <div style="display: inline;">
            <select id="Tasksess">
                <option value="">لطفاً کار را انتخاب کنيد</option>
                <optgroup label="کار های جديد">
                        <option value="16"style="">q3fe</option>
                        <option value="18"style="">fjhv j</option>
                        <option value="19"style="">wref</option>
                        <option value="25"style="">ff</option>
                </optgroup>
                <optgroup label="کار های در دست اقدام">
                        <option value="13"style="">rr</option>
                        <option value="15"style="">yy</option>
                </optgroup>
                <optgroup label="کار های تمام شده">
                        <option value="14"style="">tt</option>
                        <option value="18"style="">fjhv j</option>
                </optgroup>
            </select>
        </div>
        <div style="display: inline;">
            <select id="Statusess" name="Statusess"><option value="">لطفاً وابستگی را انتخاب کنيد</option>
<option value="1">پيشنياز</option>
<option value="2">همنياز</option>
</select>
        </div>
        <div style="display: none;" id="Ok">
            ok
        </div>
        <div style="display: none;" id="noOk">
            تکراری
        </div>
        <div id="loadingGif" style="display: none;">
            <img src="/Content/Images/ajax-loader/253L.gif" alt=""/>
        </div>
    </div>
</div>
<script type="text/javascript">
    $(document).ready(function () {

        var Maindiv = $("#MainDiv");
        var toClone = $("#toClone");

        //$("#Statusess").each(function () {
            $("#Statusess").live('change', function () {
                if ($(this).find(":selected").val() != "") {                    
                    if ($(this).parent().prev().find(":selected").val() != "") {
                        $(this).parent().parent().find("#loadingGif").attr("style", "display: inline;");
                        $.ajax({
                            url: '/ProjectAdmin/Project/AddTaskDependency?MainTaskId=' + $("#TaskId").val() + '&DependentTaskId=' + $(this).parent().prev().find(":selected").val() + '&Status=' + $(this).find(":selected").val(),
                            type: 'GET',
                            success: function (data, status) {
                                if (data != "0") {
                                    $(this).parent().parent().find("#Ok").attr("style", "display: inline;");
                                    $(this).parent().parent().find("#noOk").attr("style", "display: none;");
                                }
                                else if (data == "0") {
                                    $(this).parent().parent().find("#Ok").attr("style", "display: none;");
                                    $(this).parent().parent().find("#noOk").attr("style", "display: inline;");
                                }
                                var div = $('div:eq(0)', Maindiv).clone();
                                Maindiv.append(div);
                            }
                        });
                        $(this).parent().parent().find("#loadingGif").attr("style", "display: none;");

                    }
                }
            });
        //});

    });
</script>


لطفاً کار را انتخاب کنيد
q3fe
fjhv j
鹪鹩
ff
rr
yy
tt
fjhv j
لطفاً وابستگی را انتخاب کنيد
پيشنياز
همنياز
好啊
تکراری
$（文档）.ready（函数（）{
var Maindiv=$（“#Maindiv”）；
var-toClone=$（“#toClone”）；
//$（“#Statusess”）。每个（函数（）{
$（“#Statusess”）.live（'change'，function（）{
if（$（this）.find（“：selected”）.val（）！=”）{
if（$（this）.parent（）.prev（）.find（“：selected”）.val（）！=”）{
$（this.parent（）.parent（）.find（#loadingGif”）.attr（“样式”，“显示：内联；”）；
$.ajax({
url:'/ProjectAdmin/Project/AddTaskDependency？MainTaskId='+$（“#TaskId”）.val（）+'&DependentTaskId='+$（this.parent（）.prev（）.find（“：selected”）.val（）+'&Status='+$（this.find（“：selected”）.val（），
键入：“GET”，
成功：功能（数据、状态）{
如果（数据！=“0”）{
$（this.parent（）.parent（）.find（#Ok”）.attr（“style”，“display:inline；”）；
$（this.parent（）.parent（）.find（#noOk”）.attr（“样式”，“显示：无；”）；
}
否则如果（数据=“0”）{
$（this.parent（）.parent（）.find（#Ok”）.attr（“style”，“display:none；”）；
$（this.parent（）.parent（）.find（#noOk”）.attr（“样式”，“显示：内联；”）；
}
var div=$（'div:eq（0'），Maindiv.clone（）；
主分区附加（分区）；
}
});
$（this.parent（）.parent（）.find（#loadingGif”）.attr（“style”，“display:none；”）；
}
}
});
//});
});
在这种情况下，您不应该使用live，因为每次打开对话框时都会“记住”绑定。如果我正确理解您的问题，您应该使用“单击”而不是“实时”绑定。

您应该尝试：

$("#Statusess").off('change').on('change', function() {

});
PS：仅适用于jQuery 1.7+。如果无法升级：

$("#Statusess").die('change').live('change', function() {

});
可以直接绑定事件处理程序，而不使用
live（）
或任何其他委托方法，也可以将代码移动到外部脚本文件中，这样就不会在每次ajax调用中加载相同的代码。使用
die（）

如果保留代码，只需使用：


  $("#Statusess").change(function () {...


也许你可以试试：


        jQuery(function ($) {

            var Maindiv = $("#MainDiv");
            var toClone = $("#toClone");

                $("#Statusess").on('change', function () {
                    if ($(this).find(":selected").val() != "") {                    
                        if ($(this).parent().prev().find(":selected").val() != "") {
                            $(this).parent().parent().find("#loadingGif").css("display", "inline");
                            $.ajax({
                                url: '/ProjectAdmin/Project/AddTaskDependency?MainTaskId=' + $("#TaskId").val() + '&DependentTaskId=' + $(this).parent().prev().find(":selected").val() + '&Status=' + $(this).find(":selected").val(),
                                type: 'GET',
                                success: function (data, status) {
                                    if (data != 0) {
                                        $(this).parent().parent().find("#Ok").css("display", "inline");
                                        $(this).parent().parent().find("#noOk").css("display", "none");
                                    }
                                    else if (data == 0) {
                                        $(this).parent().parent().find("#Ok").css("display", "none");
                                        $(this).parent().parent().find("#noOk").css("display", "inline");
                                    }
                                    var div = $('div:eq(0)', Maindiv).clone();
                                    Maindiv.append(div);
                                    div.empty();
                                }
                            });
                            $(this).parent().parent().find("#loadingGif").css("display", "none");

                        }
                    }
                });


        });



如上所述，您应该使用
.delegate（）
而不是
.live（）

为了使用
delegate
您需要做的就是指定一个您将在其中收听的父级和一个它将在其中执行操作的选择器

试试这个：


<script>
$(function(){
var Maindiv = $("#MainDiv");
var toClone = $("#toClone");

$("#MainDiv").delegate('#Statusess','change', function () {
    if ($(this).find(":selected").val() != "") {                    
      if ($(this).parent().prev().find(":selected").val() != "") {
        $(this).parent().parent().find("#loadingGif").attr("style", "display: inline;");
        $.ajax({
            url: '/echo/html/',
            type: 'POST',
            success: function (data, status) {
                data = "1";
                if (data != "0") {
                    $(this).parent().parent().find("#Ok").attr("style", "display: inline;");
                    $(this).parent().parent().find("#noOk").attr("style", "display: none;");
                }
                else if (data == "0") {
                    $(this).parent().parent().find("#Ok").attr("style", "display: none;");
                    $(this).parent().parent().find("#noOk").attr("style", "display: inline;");
                }
                var div = $('div:eq(0)', Maindiv).clone();
                Maindiv.append(div);
            }
        });
        $(this).parent().parent().find("#loadingGif").attr("style", "display: none;");

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




$（函数（）{
var Maindiv=$（“#Maindiv”）；
var-toClone=$（“#toClone”）；
$（“#MainDiv”）.delegate（“#Statusess”、“change”、function（）{
if（$（this）.find（“：selected”）.val（）！=”）{
if（$（this）.parent（）.prev（）.find（“：selected”）.val（）！=”）{
$（this.parent（）.parent（）.find（#loadingGif”）.attr（“样式”，“显示：内联；”）；
$.ajax({
url:“/echo/html/”，
键入：“POST”，
成功：功能（数据、状态）{
data=“1”；
如果（数据！=“0”）{
$（this.parent（）.parent（）.find（#Ok”）.attr（“style”，“display:inline；”）；
$（this.parent（）.parent（）.find（#noOk”）.attr（“样式”，“显示：无；”）；
}
否则如果（数据=“0”）{
$（this.parent（）.parent（）.find（#Ok”）.attr（“style”，“display:none；”）；
$（this.parent（）.parent（）.find（#noOk”）.attr（“样式”，“显示：内联；”）；
}
var div=$（'div:eq（0'），Maindiv.clone（）；
主分区附加（分区）；
}
});
$（this.parent（）.parent（）.find（#loadingGif”）.attr（“style”，“display:none；”）；
}
}
});
});



在这里你有一个工作，也有一个参考功能的链接
 您的服务器代码是否也使用底部的javascript进行响应

如果是这样，您的问题是每次加载ui对话框时，javascript都会执行一次，从而产生额外的绑定，因此每次执行代码时，都会添加额外的请求


这种情况下的修复很简单，将javascript代码移到加载ui对话框的页面。
侧注，不是修复：不要使用
live（）
，而是
on（）
instedi