Jquery onchange

Question

我创建了一个将数据( ajax )发送到数据库的函数，根据服务器的响应，我需要通知一条消息，但似乎每当我更改select选项时，我就会得到每次更改的警告消息(如果我单击4次更改select，我就会收到4次警报)，但是如果我删除ajax函数并将其替换为一个警报，我就会得到它一次又一次没有重复--这里是我的JS

        $('.select_ids').change(function () {
            var id = $(this).val();
            var form = $('#form_widget_ids_' + id);
            var container = form.parent('.ewb_forms');
            var box = container.parent('.edit_widget_box');

            container.children('.selected').fadeOut(300, function () {
                $(this).removeClass('selected');
                form.fadeIn(300, function () {
                    $(this).addClass('selected');
                });
            });
            Widget.updateSSOUrl(box);

            $.ajax({
                type: "POST",
                url: window.location + "",
                data: {'id': id}

            }).done(function (msg) {

                $(".red").on('click', function (evt) {
                    if ('done' == msg) {
                        evt.preventDefault();
                        alert('NOP');
                    }
                })



            });
        });

Answer 1

我认为你绑定的事件是错误的。对于新附加的项，在您的情况下最好使用

$(document).on('click', ".red", function (evt) {

                })

它必须移到ajax成功之外，因为现在您每次都会触发它。

-编辑的-如果您只想提醒ajax的输出，则不需要onClick事件。

$('.select_ids').change(function () {
            var id = $(this).val();
            var form = $('#form_widget_ids_' + id);
            var container = form.parent('.ewb_forms');
            var box = container.parent('.edit_widget_box');

            container.children('.selected').fadeOut(300, function () {
                $(this).removeClass('selected');
                form.fadeIn(300, function () {
                    $(this).addClass('selected');
                });
            });
            Widget.updateSSOUrl(box);

            $.ajax({
                type: "POST",
                url: window.location + "",
                data: {'id': id}

            }).done(function (msg) {
                    if (msg === 'done') {
                        evt.preventDefault();
                        alert('NOP');
                    }
            });
        });

如果要在单击按钮上显示最新结果，可以将msg存储在全局变量上，单击div显示如下

var globalMsg = "";
$('.select_ids').change(function () {
            var id = $(this).val();
            var form = $('#form_widget_ids_' + id);
            var container = form.parent('.ewb_forms');
            var box = container.parent('.edit_widget_box');

            container.children('.selected').fadeOut(300, function () {
                $(this).removeClass('selected');
                form.fadeIn(300, function () {
                    $(this).addClass('selected');
                });
            });
            Widget.updateSSOUrl(box);

            $.ajax({
                type: "POST",
                url: window.location + "",
                data: {'id': id}

            }).done(function (msg) {
              globalMsg = msg
            });
        });

$(".div").click(function() { alert(globalMSG); });