Использовал .bind, но теперь должен был использовать .delegate ... пробовал .undelegate?

Question

Вот jsfiddle, jsfiddle.net / kqreJ

Поэтому я использовал .bind без проблем для этой функции, но затем я загрузил больше обновлений на страницу и обнаружил, что .bind не работает для контента, импортированного на страницу, а только для контента, уже находящегося на странице! Отлично!

Так что я переключил его на .delegate, что довольно круто, но теперь я не могу понять, как .bind .unbind моей функции, как это было ???

Функция, использующая .bind, которая работала идеально ... за исключением того, что не работала с контентом ajax ..: (

$('.open').bind("mouseup",function(event) {
var $this = $(this), handler = arguments.callee;
$this.unbind('mouseup', handler);
var id = $(this).attr("id");
var create = 'nope';

    var regex = /\d+$/,
    statusId = $('#maindiv .open').toArray().map(function(e){
        return parseInt(e.id.match(regex));
    });

var divsToCreate = [ parseInt(id) ];

$.each(divsToCreate, function(i,e)
{
    if ( $.inArray(e, statusId) == -1 ) {
        create = 'yup';
    }
});

        if( create == 'yup' ) {
            if(id) {
                    $.ajax({
                    type: "POST",
                    url: "../includes/open.php",
                    data: "post="+ id,
                    cache: false,
                    success: function(html) {
                    $('.open').html(html);
                    $this.click(handler);
                    }
                    });
            }
        }

});

Новая функция, использующая .delegate, которая не связана и создает несколько экземпляров?

$('#maindiv').delegate("span.open", "mouseup",function(event) {
var $this = $(this), handler = arguments.callee;
$this.unbind('mouseup', handler);
var id = $(this).attr("id");
var create = 'nope';

    var regex = /\d+$/,
    statusId = $('#maindiv .open').toArray().map(function(e){
        return parseInt(e.id.match(regex));
    });

var divsToCreate = [ parseInt(id) ];

$.each(divsToCreate, function(i,e)
{
    if ( $.inArray(e, statusId) == -1 ) {
        create = 'yup';
    }
});

        if( create == 'yup' ) {
            if(id) {
                    $.ajax({
                    type: "POST",
                    url: "../includes/open.php",
                    data: "post="+ id,
                    cache: false,
                    success: function(html) {
                    $('.open').html(html);
                    $this.click(handler);
                    }
                    });
            }
        }

});

Я часами пытался в этом разобраться, потому что мне нравится учиться делать это самому, но мне пришлось сломаться и попросить помощи ... разочаровавшись!

Я также читал, что когда вы связываете и освобождаете .delegate, вы должны поместить его выше содержимого ajax? Я пытался использовать .die () и .undelegate () ... Может быть, я просто не знаю, где его разместить?

Answer 1

Взгляните на undelegate

Это делает delegate что unbind делает bind.

В вашем случае, я думаю, это будет что-то вроде:

$('#maindiv').undelegate("span.open", "mouseup").delegate("span.open", "mouseup" ...

Затем вы можете опустить $this.unbind('mouseup', handler); внутри функции.