Могу ли я получить полезные данные в живом обработчике jQuery для пользовательского события? - PullRequest
4 голосов
/ 01 октября 2009

jQuery теперь позволяет вам использовать live для обработки пользовательских событий, что я использовал в своем последнем проекте и нашел очень удобным. Однако я столкнулся с ограничением / ошибкой, которые, я надеюсь, кто-то сможет мне помочь.

Когда вы запускаете событие, вы также можете передать дополнительный массив данных, например:

 $(this).trigger('custom', ['foo', 'bar' ]);

Если бы вы просто использовали bind , вы могли бы получить абсолютный доступ к этим переменным. Однако, если вы используете live, оказывается, что у вас нет доступа к данным , насколько я могу судить . Я ошибся? Есть ли другой способ?

Вот пример демонстрационного кода:

 $().ready(function() {

    $('button').click(function(){
        $('<li>Totally new one</li>').appendTo('ul');
    });

    $('li').bind('custom', function(e, data) {
        // this one works fine for old elements, but not for new ones
        $('#output1').text('Bind custom from #' + e.target.id + '; ' + data);
    }).live('custom', function(e, data) {
        // this one triggers for old and new elements, but data is useless
        $('#output2').text('Live custom from #' + e.target.id + '; ' + data);
    }).live('click', function(){
        $('div').text('');
        // just using click count to illustrate passing data in the trigger
        var clicks = $(this).data('clicks');
        if(typeof clicks == 'undefined') clicks = 1;
        $(this).trigger('custom', ['Times clicked: ' + clicks ]).data('clicks', clicks + 1);
    });
});

И соответствующий HTML:

<button>Add</button>
<ul>
    <li id="one">First Item</li>
    <li id="two">Second Item</li>
    <li id="three">Third Item</li>
</ul>
<div id="output1">Result 1</div>
<div id="output2">Result 2</div>

1 Ответ

2 голосов
/ 02 октября 2009

Похоже, что самым простым подходом может быть использование формата, описанного в последнем «альтернативном» примере на http://docs.jquery.com/Events/trigger#eventdata. В примере используется литерал объекта для указания объекта события, в котором вы можете создавать собственные свойства. Я также попробовал описанный выше подход безрезультатно, но альтернативный формат работает для меня. Так что вместо звонка

$(this).trigger('custom', ['Times clicked: ' + clicks ])

попробовать

$(this).trigger({type:'custom', clicks: clicks});

, а затем ссылаться на него в обработчике вашего "пользовательского" события через:

"Times clicked: " + e.clicks;

Надеюсь, это поможет!

...