Question

我试图不要一遍又一遍地写相同的功能。我试图在$（1,2,3）.on（）中列出jquery选择器。但它只在第一个上执行。

var spinnerApt1X, spinnerApt1Y, spinnerApt2X, spinnerApt2Y;

function popSpinPtEditor(pt) {
  spinnerApt1X = $('#sectorEditorApt1XScroll').spinner({ min: 0});
  spinnerApt1X.spinner( 'value', pt.p1.x );
  spinnerApt1Y = $('#sectorEditorApt1YScroll').spinner({ min: 0});
  spinnerApt1Y.spinner( "value", pt.p1.y );
  spinnerApt2X = $('#sectorEditorApt2XScroll').spinner({ min: 0});
  spinnerApt2X.spinner( "value", pt.p2.x );
  spinnerApt2Y = $('#sectorEditorApt2YScroll').spinner({ min: 0});
  spinnerApt2Y.spinner( "value", pt.p2.y );
}

var spinPtObjAr = [spinnerApt1X, spinnerApt1Y, spinnerApt2X, spinnerApt2Y];

//this is the function I need help with.
$().add(  (function () {
  for (var i = 0; i < spinPtObjAr.length; i++) {
    var spin = spinPtObjAr[i]; 
  }
return spin
})()).on(
"spinstop", function(){
  console.log($(this).spinner('value'));
});

Answer 1

要将单个jQuery集合的数组转换为单个jQuery集合，请使用Array＃reduce（），如下所示：

var lines = [.....];
fs.writeFile('myoutput.txt', lines.join('\n'), 'utf8');

<强> DEMO

注意：$superCollection = arrayOfCollections.reduce(function(prev, current) { prev.add(current); }, $());中元素的顺序将是文档顺序，无论它们的添加顺序如何。 documentation for add()包含对订单问题的良好解释。

在这种特殊情况下，您可以这样做：

$superCollection

此方法没有任何问题，但更常规的是，在应用var spinnerApt1X, spinnerApt1Y, spinnerApt2X, spinnerApt2Y, allSpinners; function popSpinPtEditor(pt) { spinnerApt1X = $('#sectorEditorApt1XScroll').spinner({ min: 0}); spinnerApt1X.spinner( 'value', pt.p1.x ); spinnerApt1Y = $('#sectorEditorApt1YScroll').spinner({ min: 0}); spinnerApt1Y.spinner( "value", pt.p1.y ); spinnerApt2X = $('#sectorEditorApt2XScroll').spinner({ min: 0}); spinnerApt2X.spinner( "value", pt.p2.x ); spinnerApt2Y = $('#sectorEditorApt2YScroll').spinner({ min: 0}); spinnerApt2Y.spinner( "value", pt.p2.y ); var spinnerArray = [spinnerApt1X, spinnerApt1Y, spinnerApt2X, spinnerApt2Y]; allSpinners = spinnerArray.reduce(function(prev, current) { prev.add(current); }, $()); }之前，您将使用单个jQuery选择器选择所有元素，然后使用由此形成的集合来调用/初始化spinner()。

Answer 2

我会在一开始就考虑构建这些元素的集合。

添加到它们的公共类都将减少需要使用选择器中的所有个人ID。数据属性可用于定义它们引用的属性

<element id ="sectorEditorApt1XScroll" class="my-spinner" data-pt="p1" data-axis="x">

然后，您可以使用单个类选择器存储集合，并在一个简单的循环中完成所有初始化

var $spinners = $('.my-spinner').on("spinstop", function(){
  console.log($(this).spinner('value'));
});

function popSpinPtEditor(pt) {
   $spinners.each(function(){
       var ptProps = $(this).data(); 
       $(this).spinner({min:0}.spinner( 'value', pt[ptProps.pt][ptProps.axis] );
   });
}

很少需要构建自己的jQuery元素数组，因为jQuery在内部基于使用的选择器执行此操作

Answer 3

  function popSpinPtEditor(pt, collection) {
  var ptAr = [pt.p1.x, pt.p1.y, pt.p2.x, pt.p2.y, pt.cp1.x, pt.cp1.y, pt.cp2.x, pt.cp2.y];
 collection.each(function(i){
     var ptProps = $(this).data();
     $(this).spinner({min:0}).spinner( 'value', ptAr[i] );
  });

  collection.on("spinstop", function(){
    console.log($(this).spinner('value'));
  });
}

var pt = curve(), collection = $('.sectEditSpin');
popSpinPtEditor(pt, collection);

你帮我把50行代码变成了10行。

如何在jquery widget spinner中注册多个事件

3 个答案: