应用/使用具有多个具有相同类 JQUERY 的 div 的函数答案

【问题标题】：Apply/Use a function with several divs with the same class JQUERY应用/使用具有多个具有相同类 JQUERY 的 div 的函数
【发布时间】：2014-02-11 18:48:54
【问题描述】：

我使用一个小脚本来检测两个元素是否碰撞。

function collision($yo, $obstaculo) {
var x1 = $yo.offset().left;
var y1 = $yo.offset().top;
var h1 = $yo.outerHeight(true);
var w1 = $yo.outerWidth(true);
var b1 = y1 + h1;
var r1 = x1 + w1;
var x2 = $obstaculo.offset().left;
var y2 = $obstaculo.offset().top;
var h2 = $obstaculo.outerHeight(true);
var w2 = $obstaculo.outerWidth(true);
var b2 = y2 + h2;
var r2 = x2 + w2;

if (b1 < y2 || y1 > b2 || r1 < x2 || x1 > r2) return false;
return true;

}

我的问题是我不知道如何将函数与所有类名为“.obstacle”的 div 一起使用。知道我是这样调用函数的：

collision($('#character'),$('.obstacle'));

编辑：我使用 .each 在 jfiddle 中进行了测试，但似乎不起作用。出于某种原因，只检索 las 元素，它总是返回 true：

http://jsfiddle.net/Osaka_lime/jV9Ls/27/

像往常一样，对不起我糟糕的英语和谢谢！！！！

【问题讨论】：

标签： jquery function class arguments

【解决方案1】：

因为 $obstaculo 中可能包含多个对象，所以您必须遍历集合中的所有 div 并检查每一个。使用 jQuery，您必须执行以下操作：

function collision($yo, $obstaculo) {
   var x1 = $yo.offset().left;
   var y1 = $yo.offset().top;
   var h1 = $yo.outerHeight(true);
   var w1 = $yo.outerWidth(true);
   var b1 = y1 + h1;
   var r1 = x1 + w1;

   $obstaculo.each(function () {
      var x2 = $(this).offset().left;
      var y2 = $(this).offset().top;
      var h2 = $(this).outerHeight(true);
      var w2 = $(this).outerWidth(true);
      var b2 = y2 + h2;
      var r2 = x2 + w2;
      if (b1 < y2 || y1 > b2 || r1 < x2 || x1 > r2) return false;
   });

   return true;
}

请注意，我没有测试过这段代码，但希望你可以以此为例，它可以让你知道下一步该去哪里。

【讨论】：

感谢您的帮助，我正在尝试使用您的 .each 函数，但似乎总是返回 true，您可以在此链接中查看我的代码：jsfiddle.net/Osaka_lime/jV9Ls/27
好的，我找到了一个 .each 解决方案，你可以在这个 jfiddle jsfiddle.net/jV9Ls/29 中看到它，感谢您的帮助。
很抱歉没有尽快回复您，但很高兴您找到了解决方案！

【解决方案2】：

我找到了一个使用 .each 调用我的函数冲突的解决方案：

pum = false;
      $(".obstaculo").each(function () { pum = pum || collision($('#character'), $(this), dir) });

你可以在这里看到它的工作原理：

http://jsfiddle.net/jV9Ls/29/

晚安！

【讨论】：