6

私が使用する以下のコードがありclone()ますlive()。コードは、リンク付きの jQuery UI ダイアログに読み込まれています。リンクをクリックするたびにサーバーに移動し、ダイアログに以下のコードを入力します。初めてページが読み込まれるときは正常に動作しますが、ダイアログを閉じてリンクをもう一度クリックすると、送信される Ajax リクエストの数が増加します。

最初に変更をトリガーして、1 つのリクエストのみを送信し、ダイアログを閉じて再度読み込み、変更をトリガーします。2 つの Ajax リクエストを同時に送信し、3 回目は 3 つのリクエストを同時に送信します。

私の問題はどこにあると思いますか？

<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>
4

6 に答える 6

2

試してみてください：

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

});

PS：jQuery1.7以降でのみ。アップグレードできない場合：

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

});
于 2012-06-13T12:41:47.210 に答える
1

あなたのサーバー コードは、一番下の JavaScript でも応答しますか?

その場合、問題は、UI ダイアログがロードされるたびに JavaScript が 1 回実行されるため、余分なバインディングが発生するため、コードを実行するたびに追加のリクエストが追加されることです。

この場合の修正は簡単です。代わりに、UI ダイアログをロードしているページに JavaScript コードを移動します。

于 2012-06-23T13:32:27.960 に答える
1

この場合、ダイアログが開かれるたびにバインディングが「記憶」されるため、 live を使用しないでください。私が問題を正しく理解している場合は、「ライブ」バインディングの代わりに「クリック」を使用する必要があります。

于 2012-06-13T12:39:27.733 に答える
0

live()他の委任メソッドを使用せずに、または他の委任メソッドを使用せずにイベントハンドラーを直接バインドするか、コードを外部スクリプトファイルに移動して、各ajax呼び出しで同じコードをロードしないようにします。使用die()することは、存在する必要がなく、簡単に修正できる問題に対する単なるバンドエイドです。

コードをそのままにしておくと、次のように簡単に使用できます。

  $("#Statusess").change(function () {...
于 2012-06-17T05:56:26.837 に答える
0

おそらくあなたは試すことができます：

        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");

                        }
                    }
                });


        });
于 2012-06-17T19:01:49.103 に答える
0

上記のよう.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>

ここでは、動作中のjsfiddleがあります。また、ここには.delegate()関数への参照用のリンクがあります。

于 2012-06-23T12:01:32.800 に答える