Вычислять и редактировать несколько атрибутов в одном вызове jQuery - PullRequest
4 голосов
/ 01 июля 2011

Мне нужно вычислить новые и отредактировать атрибуты 'x' и 'y' элемента SVG (rect) с помощью одного вызова jQuery.

Теперь я знаю, что вы можете сделать это:

var incBy = 20;

$('#test').attr('x', function(i, val) {
    return parseInt(val) + incBy;
});

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

Ответы [ 4 ]

4 голосов
/ 01 июля 2011

Вы можете попробовать использовать карту с методом attr в jQuery.

$('#test').attr(
        {'x': editValue,
         'y': editValue
        });
function editValue(i, val) {
   return parseInt(val) + incBy;
};
3 голосов
/ 01 июля 2011
var incBy = 20;

$('#test').each(function () {
    this.x += incBy;
    this.y += incBy;
});

или, что более элегантно, это (также имеет более высокую производительность, если вы хотите изменить тысячи объектов)

$.fn.extend({
  modCoordsBy: function(amount) {
    for (var i=0, j=this.length; i<j; i++) {
      this[i].x += amount;
      this[i].y += amount;
    }
    return this;
  }
});

$('#test').modCoordsBy(20);

Примените проверки диапазона или типовые тесты к x и y, как считаете нужным.

1 голос
/ 01 июля 2011

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

$('#test').attr('x', myFunction);
$('#test').attr('y', myFunction);

function myFunction(i, val) {
    return parseInt(val) + incBy;
}
0 голосов
/ 01 июля 2011

Если вы выделите это, вы также можете сделать это в одной строке:

$('#test').attr('x', myFunction).attr('y', myFunction);

function myFunction(i, val) {
  return parseInt(val) + incBy; 
}

Или абстрагировать это больше и передать в отдельную функцию атрибуты, которые вы хотите применить к

process('x', 'y');

function process() {
  for (var i = 0; i < process.arguments.length; i++)
    $('test').attr(process.arguments[i]), myfunction);

  function myFunction(i, val) {
    return parseInt(val) + incBy; 
  }
}

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

...