Question

所以我一直在讨论这个代码，希望将一堆对象调整为与最高对象相同的高度。我将它组成小组，这样你就可以有五个独立的项目组，这些项目的大小都可以达到组中最高元素的高度。我创建了一个名为“sizeHeightToOther”的自定义属性。这个想法是你要将它添加到一个元素并将“sizeHeightToOther”设置为等于组（'1'，'2'，'3'，'4'或'5'）。不幸的是，代码无效。这就是我到目前为止所拥有的。任何帮助都会非常感激，任何人如果欢迎使用它，那么这个bug就会被弄清楚。

function SizeHeightToOthers() {

  //The following function gets the heights of each element in the element arrays:
  function GetHeights(elementArray) {
    elementHeightArray = new float[elementArray.length];
    for (int i = 1; i < elementArray.length; i++) {
      elementHeightArray[i] = elementArray.height();
    }
    return elementHeightArray;
  }


  //The following function gets the max height from each height array:	
  function GetMaxs(elementHeightArray) {
    var currentValue = elementHeightArray[0];
    for (var i = 1; i < elementHeightArray.length; i++) {
      if (elementHeightArray[i] > currentValue) {
        currentValue = elementHeightArray[i];
      }
    }
    return value;
  }

  //The following function changes all of the heights of the elements in the element array to be the same as the max height from that array.
  function changeHeights(elementArray, elementHeightArray, maxHeight) {
    for (int i = 0; i < elementArray.length; i++) {
      if (elementHeightArray[i] < maxHeight) {
        elementArray[i].height(maxHeight);
      }
    }
  }



  //var numberOfElements = $("[sizeHeightToOtherGroup]").size();
  var elementArrayOne = $("[sizeHeightToOther='1']").toArray();
  var elementArrayTwo = $("[sizeHeightToOther='2']").toArray();
  var elementArrayThree = $("[sizeHeightToOther='3']").toArray();
  var elementArrayFour = $("[sizeHeightToOther='4']").toArray();
  var elementArrayFive = $("[sizeHeightToOther='5']").toArray();


  var elementHieghtArrayOne = GetHeights(elementArrayOne);
  var elementHieghtArrayTwo = GetHeights(elementArrayTwo);
  var elementHieghtArrayThree = GetHeights(elementArrayThree);
  var elementHieghtArrayFour = GetHeights(elementArrayFour);
  var elementHieghtArrayFive = GetHeights(elementArrayFive);

  changeHeights(elementArrayOne, elementHeightArrayOne, GetMaxs(elementHeightArrayOne));
  changeHeights(elementArrayTwo, elementHeightArrayTwo, GetMaxs(elementHeightArrayTwo));
  changeHeights(elementArrayThree, elementHeightArrayThree, GetMaxs(elementHeightArrayThree));
  changeHeights(elementArrayFour, elementHeightArrayFour, GetMaxs(elementHeightArrayFour));
  changeHeights(elementArrayFive, elementHeightArrayFive, GetMaxs(elementHeightArrayFive));
}


$(function() {
      SizeHeightToOthers();
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

<body>
  <img src="https://upload.wikimedia.org/wikipedia/en/6/6f/Smiley_Face.png" sizeHeightToOthers='1' id="faceOne">
  <img src="http://img1.123freevectors.com/wp-content/uploads/new/icon/075-smiley-face-vector-art-free-download-l.png" sizeHeightToOthers='1' id="faceTwo">
</body>

我真的很抱歉，如果它真的很蠢，我对JavaScript很新，但在其他语言方面有很多经验。

Answer 1

不确定这是否能解决问题，但是带有getHeights（）的变量拼写错误＆＃34; ... hiegth＆＃34;

var elementH  ie  ghtArrayOne

所以GetMaxs()将失败

Answer 2

此处代码至少存在一些问题。首先，您正在加载旧版本的jQuery，该版本在jQuery对象上没有toArray方法。您的属性选择器与实际的HTML标记之间也存在不匹配。

以下代码应该可以完成您要执行的操作。这里可能存在一些可能不熟悉的JS特性，具体取决于您来自哪种语言。 Math.max.apply(...可能是最特殊的。它通过创建所有元素高度的数组返回最大高度，然后使用.apply()方法在单个调用中从数组中检索最大值。

$(function () {
    var sizeGroups = [1, 2, 3, 4, 5];

    sizeGroups.forEach(function (size) {
        sizeToMaxHeight($('[sizeHeightToOthers="' + size + '"]').toArray());
    });

    function sizeToMaxHeight(els) {
        var maxHeight = getMaxHeight(els);

        els.forEach(function (el) {
            $(el).height(maxHeight);
        });

        function getMaxHeight(els) {
            return Math.max.apply(null, els.map(function (el) {
                return $(el).height();
            }));
        }
    }
});

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<body>
  <img src="https://upload.wikimedia.org/wikipedia/en/6/6f/Smiley_Face.png" sizeHeightToOthers='1' id="faceOne">
  <img src="http://img1.123freevectors.com/wp-content/uploads/new/icon/075-smiley-face-vector-art-free-download-l.png" sizeHeightToOthers='1' id="faceTwo">
</body>

将使对象具有相同大小的Javascript

2 个答案: