#jquery #jquery-selectors #dom-traversal
#jquery #jquery-селекторы #dom-обход
Вопрос:
Если я хочу получить форму, затем захватить какую-либо кнопку, затем приложить к этой кнопке какое-либо действие, которое отправляет мою форму, в настоящее время я делаю это следующим образом:
<form>
<button>Some Button</button>
</form>
$('form').find('button').click(function(){
$(this).closest('form').submit(); // is there a better way of getting the form?
});
Мне интересно, есть ли более эффективный способ выбора исходного элемента формы в моей находке. Вместо того, чтобы выполнять резервное копирование dom, есть ли какой-либо способ получить ссылку на мой исходный form
объект внутри события click его потомка?
К сожалению, в этом случае .context
даст мне button
элемент, каким-либо образом я могу получить исходный контекст? Или мне просто нужно пройти вверх?
Обратите внимание, что это надуманный пример, на самом деле я не использую кнопки и формы, но меня больше интересует извлечение исходного контекста внутри find
.
Комментарии:
1. Не знаю, что лучше с точки зрения производительности, но, возможно, parent() — лучший вариант?
2. да, но я на самом деле вложен немного глубже, чем в моем примере
Ответ №1:
Я думаю, смысл в том, чтобы кэшировать первый вызов? Просто запустите его через each(), что позволит вам сохранить контекст в параметрах этого метода.
$('form').each(function(idx,el){
$(this).find('button').click(function(){
$(el).submit();
});
});
Ответ №2:
Это зависит от того, что вы пытаетесь сделать. Если вы находитесь в обратном вызове события, нет, нет способа получить исходный выбор. Единственные данные, которые у вас есть, это то, на каком элементе был сделан щелчок, и несколько подробностей о самом событии щелчка. Не забывайте, что form
может совпадать несколько разных элементов, поэтому узнать, какой из них вы должны сопоставлять, невозможно. (Если только не существует только одного — но это все равно не очень стабильный способ кодирования вашего сайта.)
Если вы используете только стандартный контекст цепочки методов, вы можете использовать end
, чтобы вернуться на один этап поиска:
$('form').find('button').prop({name: 'foo', value: 'bar'}).end().submit();
Комментарии:
1. да, я нахожусь в режиме обратного вызова, больше не в цепочке
Ответ №3:
Если у вас есть только одна форма, вы могли бы сделать что-то вроде этого:
var $form = $('form');
$form.find('button').click(function() {
$form.submit();
});
Просто вычислите $('form')
один раз и используйте его по мере необходимости.
Хотя я сомневаюсь, что $(this).closest('form')
это действительно будет так дорого. OTOH, хорошие привычки — это хорошие привычки, и не вычислять одно и то же снова и снова, как правило, хорошая привычка.
Ответ №4:
Насколько я знаю, нет способа ссылаться на объект поиска из найденного объекта. Это потому, что вы получите только объект jQuery, который был найден, а не информацию из функции, которая была вызвана для его поиска:
var blah = $('blah');
//The following variable will have no direct reference to blah, but
//blah can still be used if it stays in scope:
var thingWithNoReferenceToBlah = blah.find('thing');