Зачем всплывающее уведомление несколько раз после события щелчка? - PullRequest
0 голосов
/ 03 мая 2011

На странице есть пара кнопок Добавить (li .plus).

Когда вы нажимаете на кнопку «Добавить» и предполагаете, что json.success имеет значение false, оно будет всплывать через $.colorbox плагин

Всплывающее окно извлекает данные из href:"/Handle/Postcode/?val" + Val

Из всплывающего окна есть кнопка отправки (#submitButton), когда я нажимаю на кнопку отправки, она несколько раз сохраняет всплывающее окно с предупреждением, я не понимаю, почему это происходит? как это исправить?

$("li .plus").click(function(event) {
    event.preventDefault();

    var Val;
    Val = $('#id').val()

        $.getJSON(Address +"/Handle/Add", {
            Val:Val
        }, function(json) {
            if (json.success == "false" && json.error == "NoArea") {
                $.colorbox({
                    width:"450px",
                    transition:"none",
                    opacity:"0.4",
                    href:"/Handle/Postcode/?val" + Val
                });
                $("#submitButton").live('click', function() {
                   var PostCodeArea = $("#deliveryAreaPostcode").val();
                    alert(PostCodeArea);
                    //Why does it popup a few times?
                });

            }

            if (json.success == "true") {
                Backet();
            }
        });
});

1 Ответ

3 голосов
/ 03 мая 2011

Это просто, потому что вы используете функцию .live() для привязки вашего обработчика кликов.Если этот код выполняется более одного раза, ваша привязка происходит более одного раза.

Вы можете либо попытаться отследить состояние привязки и применить ее, только если она не существует, или вы можете вызвать функцию щелчка в html с помощью атрибута onClick.

Редактировать: Просто чтобы уточнить, я имел в виду что-то вроде -

HTML

 <button id='submitButton' onclick="displayAreaCode();">Submit</button>

JS

function displayAreaCode(){
    var PostCodeArea = $("#deliveryAreaPostcode").val();
    alert(PostCodeArea);
}
...