JQuery: Как динамически ссылаться на элемент?

У меня проблема с двумя частями. В первой части, я создал несколько делегированных обработчиков событий:JQuery: Как динамически ссылаться на элемент?

$('#content').on('click','#button1',function1); 
$('#content').on('click','#button2',function2);

Внутри function1 и function2, среди других видов обработки, я установил глобальные переменные, чтобы указать, какая кнопка была нажата:

function1(e) { 
    ... 
    var whichButtonClicked = $('#button1'); 
    ... 
} 

function2(e) { 
    ... 
    var whichButtonClicked = $('#button2'); 
    ... 
}

Позже, другие код должен удалить обработчик.

$('#content').off('click',whichButtonClicked,theFunctionRun);

Однако обработчик .off не работает. Это действительно работает, если я жёстко его к одной из кнопок, как это:

$('#content').off('click','#button1',theFunctionRun);

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

Как исправить это заявление:

$('#content').off('click',whichButtonClicked,theFunctionRun);

, чтобы сделать свой код работать?

Я могу запускать другие команды на него, такие как:

whichButtonClicked.trigger('click');

JSFiddle: https://jsfiddle.net/nLorh2wm/20/

источник

2016-01-19 user3798040

Вы пробовали 'whichButtonClicked =" # button1 "'? То есть сохраните селектор * string *, а не объект jquery. – nnnnnn

Я думаю, что я только что понял: $ ('# content'). Off ('click', whichButtonClicked.id, theFunctionRun); То есть, я добавил .id после имени переменной. Это логично? – user3798040

Это не должно работать, потому что в вашем коде переменная ссылается на объект jquery, а объекты jquery не имеют свойства 'id'. Вам нужно что-то вроде '$ ('# content'). Off ('click', '#' + whichButtonClicked [0] .id, theFunctionRun);' - отметить конкатенацию '#', потому что второй параметр '.off()' должен быть селектором, а не простым идентификатором, и '[0]', чтобы получить ссылку на фактический элемент из объекта jquery. – nnnnnn

Try просто удаляя $(...) вокруг элемента:

Примечание: Сниппет Безразлично» t, похоже, показывают предупреждения, но вы можете видеть, что он работает здесь: https://jsfiddle.net/rplittle/nLorh2wm/23/

$(document).ready(function() { 
 
    $('#content').on('click', '#button1', function1); 
 
    $('#content').on('click', '#button2', function2); 
 
    $('#content').on('click', '#buttonAfter', followUpFunction); 
 
}); 
 

 
var theButtonClicked; 
 
var theFunctionRun; 
 

 
function function1(e) { 
 
    alert('in function1'); 
 
    theButtonClicked = '#button1'; 
 
    theFunctionRun = function1; 
 
} 
 

 
function function2(e) { 
 
    alert('in function2'); 
 
    theButtonClicked = '#button2'; 
 
    theFunctionRun = function2; 
 
} 
 

 
function followUpFunction(e) { 
 
    $('#content').off('click', theButtonClicked, theFunctionRun); 
 
}

<div id="content"> 
 
    <button id="button1"> 
 
    Button 1 
 
    </button> 
 

 
    <button id="button2"> 
 
    Button 2 
 
    </button> 
 

 
    <button id="buttonAfter"> 
 
    Turn Off Handler for Button 1 
 
    </button> 
 
</div>

источник

2016-01-19 03:15:52

JQuery: Как динамически ссылаться на элемент?

ответ

Смежные вопросы