Обработчики событий не запускаются

0

У меня есть следующий код jQuery, и он не срабатывает по требуемым действиям, когда я вынимаю первые 2 $("body").on функции, третий, т.е. ($("body").on("click", '.upvote', function(event){) запускается. Когда я ничего не ставил, ничего не работает.

$(document).ready(function () {
    //function 1
    $("body").on("change", '.select', function (event) {
        $('.row.replace').empty();
        $('.row.replace').append("<br><br><br><br><p align='center'><img id='theImg' src='/media/loading1.gif'/></p><br><br><br><br><br><br><br><br>");
        var filter = $(this).find(":selected").attr("name");
        $.ajax({
            type: "POST",
            url: "/filter_home/" + filter + "/" + "TrendingNow" + "/",
            data: {
                'name': 'me',
                'csrfmiddlewaretoken': '{% csrf_token %}'
            },
            //dataType: "json",
            success: function (data) {
                $('.row.replace').html("mem");
            },
            error: function (xhr, errmsg, err) {
                alert(err);
            }
        }); //end ajax
        return false;
    }); //end onchange

    //function 2
    $("body").on("click", '.sorter', function (event) {
        $('.row.replace').empty();
        $('.row.replace').append("<br><br><br><br><p align='center'><img id='theImg' src='/media/loading1.gif'/></p><br><br><br><br><br><br><br><br>");
        var sort = $(this).attr("name");
        var filter = $('.select').find(":selected").attr("name");
        $.ajax({
            type: "POST",
            url: "/filter_home/" + filter + "/" + sort + "/",
            data: {
                'name': 'me',
                'csrfmiddlewaretoken': '{% csrf_token %}'
            },
            success: function (data) {
                $('.row.replace').html(data);
            },
            error: function (xhr, errmsg, err) {
                alert(err);
            }
        }); //end ajax
        return false;
    }); //end onclick

    //function 3
    $("body").on("click", '.upvote', function (event) {
        var x = $(this).attr("name");
        $.ajax({
            type: "POST",
            url: "/upvote/" + x + "/",
            data: {
                'name': 'me',
                'csrfmiddlewaretoken': '{{csrf_token}}'
            },
            dataType: "json",
            success: function (json) {
                var y = "vote-count" + x;
                $('i[class= "' + y + '"]').text(json.vote_count);

                //flip button
                $('.flip' + x).find('.card').toggleClass('flipped');
            },
            error: function (xhr, errmsg, err) {
                alert("oops, something went wrong! Please try again.");
            }
        }); //and ajax  
        return false;
    }); //end onclick   
}); //end ready
Теги:

1 ответ

0

Обработчики событий (функции 1,2,3) возвращают false. Это останавливает событие от пузырьков DOM. Я предполагаю, что они не срабатывают, как ожидалось, потому что первая функция для обработки события - это остановка распространения. Проверьте это, удалив оператор return.

Кроме того, вы можете попытаться определить, как делегированный обработчик событий ближе к цели.

  • 0
    Если бы это было так, первый из них все еще должен работать, когда все три на месте. , ,

Ещё вопросы

Сообщество Overcoder
Наверх
Меню