Bezdepbonusu7Программирование: статьи и ответы
Меню

Вопрос

JQuery сокращение "каждый"

Автор вопроса: Jetz KiОтветов: 3

Есть ли способ, которым я могу сократить jquery каждый? или есть ли альтернатива написанию jquery, каждый из которых короче кода ниже?

$('someElement').each(function () {
    functionName('value1', value2)
});
$('anotherElement').each(function () {
    functionName('value1', value2)
});
$('andMoreElement').each(function () {
    functionName('value1', value2)
});

functionName(foo, element){
   //function code here
}
  • Дайте им тот же класс, что и $('.thesameClass').each(function() { }); HTTP 11.09.2013
  • Чего вы пытаетесь достичь? undefined 11.09.2013
  • что такое foo и otherfoo - откуда они берутся? вы можете поместить их в атрибут данных элемента, а затем просто вызвать один цикл, передавая атрибут данных в functionName Pete 11.09.2013
  • $('someElement').each(functionName) было бы короче, если бы функция не нуждалась в параметрах. nnnnnn 11.09.2013
  • каждый раз, когда вызывается functionName, существует уникальное значение для параметров foo и element. поэтому каждый раз, когда я вызываю functionName внутри каждого оператора, скорее всего, значения отличаются от других. Я хотел знать, есть ли способ, которым я могу сократить каждый, как вы, сократить оператор условия if Jetz Ki 11.09.2013
  • Вы постоянно меняете вопрос. Обратите внимание, что всякий раз, когда вы меняете вопрос, вы делаете недействительными ответы, которые люди любезно предоставили. T.J. Crowder 11.09.2013

javascripthtmljqueryeach

Ответы

Ответ 1 · рейтинг 3 · T.J. Crowder

Что касается последней версии вопроса, где все три each используют одни и те же значения, лучше всего использовать селекторы с последовательностью запятых (если это селекторы ) или функцию add (если это не так):

$('someElement, anotherElement, andMoreElement').each(function () {
    functionName('value1', value2)
});

functionName(foo, element){
   //function code here
}

or

$('someElement').add('anotherElement').add('andMoreElement').each(function () {
    functionName('value1', value2)
});

functionName(foo, element){
   //function code here
}

Опять же, это зависит от того, являются ли 'someElement', 'anotherElement' и т. д. селекторами или элементами.

Поскольку вы используете each, который сразу же вызывает функцию, вы можете также использовать параметр curry ниже. Если бы вы использовали click или подобное, использование параметра curry ниже изменило бы, когда value2 был оценен (с момента вызова функции до момента ее каррирования), что может быть желательным или нежелательным в зависимости от вашего варианта использования.

Ответ на более раннюю версию вопроса:

К сожалению, вы не можете использовать для этого $.proxy или Function#bind, так как они оба изменят значение this в вызове. Вы можете создать curry функцию, которая повторно использует this, с которым она была вызвана:

var slice = Array.prototype.slice;
function curry(f) {
    var args = slice.call(arguments, 1); // Copy args after `f`
    return function() {
        return f.apply(this, args.concat(slice.call(arguments, 0)));
    };
}

Когда вы передаете функцию и X аргументов в curry, она возвращает функцию, которая при вызове вызовет исходную функцию со значением this, с которым она была вызвана, аргументами, предоставленными curry, а затем любыми аргументами, предоставленными для вызова. .

Потом:

$('someElement').each(curry(functionName, 'foo'));
$('anotherElement').each(curry(functionName, 'otherFoo'));
$('andMoreElement').each(curry(functionName, 'otherFoo'));

functionName(foo){
   //function code here
}

Или, поскольку вторые два использования имеют один и тот же аргумент:

$('someElement').each(curry(functionName, 'foo'));
$('anotherElement, andMoreElement').each(curry(functionName, 'otherFoo'));
// Or:
$('anotherElement').add('andMoreElement').each(curry(functionName, 'otherFoo'));

functionName(foo){
   //function code here
}

Ответ 2 · рейтинг 2 · Nick Andriopoulos

Предполагая, что вы хотите расширить выбор, вас может заинтересовать функция .add():

$('someElement').add('onotherElement').each(function() { })

применит вашу логику ко всем совпадениям someElement, а также onotherElement

Ответ 3 · рейтинг 1 · Andy

Изменить: это позволит вам передавать параметры в соответствии с редактированием вашего вопроса.

var a = 'Function', b = 'works';

$('.a').each(foo.bind(this, a + 'foo', b + 'foo')); // (1)

function foo(a, b, i, el) {
  console.log(a, b, $(el).text());
}

JSfiddle

(1) Я добавил foo к vars, чтобы доказать, что foo принимает не глобальные переменные, а передаваемые параметры.

Перевод вопроса и ответов сообщества Stack Overflow, лицензия CC BY-SA. Оригинал на Stack Overflow.

Похожие материалы