Question

这是我的标记：

<div class='seat'></div>
<div class='seat marked'></div>
<div class='seat marked'></div>
<div class='seat marked'></div>
<div class='seat'></div>
<div class='seat marked'></div>
<div class='seat'></div>
<div class='seat'></div>

作为简单的二进制光学翻译，这将是： -xxx-X -

我想要确定的是，包含“标记”类的元素的组/范围是否具有至少一个没有“标记”类的元素的间隙。任何想法都是最好的方法吗？

感谢

Answer 1

如果您只是想检查是否存在差距，可以执行以下操作：

$('.marked').nextUntil(":not(.marked)").length == ($('.marked').length - 1)

nextUntil实际上会按顺序为您提供项目，同时使用.marked运算符从选择器中排除:not。

示例：https://jsfiddle.net/bneen5rc/2/

如果您要查找元素：

var matchFound = false;
var firstInstance = false;
$('div').each(function()
{
   if($(this).hasClass('marked') && $(this).hasClass('seat'))
   {
      matchFound = true;
      firstInstance = true;
   }
   else
     matchFound = false;

     if(!matchFound && firstInstance)
     {
       console.log("marked sequence changed");
       return false;
     }

});

示例：https://jsfiddle.net/bneen5rc/3/

Answer 2

如果我理解你的问题，那么我相信你正在尝试建立一个座位选择器，这样我的建议就是使用jquery或javascript来完成这项工作。就像为每个数字分配一个“id”一样，并使用onmouseclick来调用javaScript函数，例如： -

<div id="1" class='seat' onmouseClick="javascript:toggleMarkVal('1');"></div>
<div id="2" class='seat marked' onmouseClick="javascript:toggleMarkVal('2');"></div>
<div id="3" class='seat marked' onmouseClick="javascript:toggleMarkVal('3');"></div>
<div id="4" class='seat marked' onmouseClick="javascript:toggleMarkVal('4');"></div>
<div id="5" class='seat' onmouseClick="javascript:toggleMarkVal('5');"></div>
<div id="6" class='seat marked' onmouseClick="javascript:toggleMarkVal('6');"></div>
<div id="7" class='seat' onmouseClick="javascript:toggleMarkVal('7');"></div>
<div id="8" class='seat' onmouseClick="javascript:toggleMarkVal('8');"></div>

现在在jQuery中你可以创建一个功能来获得所有的座位号码在函数内部你可以创建一个数组（取决于行数{你可以使用它}创建维数）在我的情况下，我想到了一个2排4列

如果你想让我为jquery编写脚本，请发帖给我，我会。

我的道歉，如果我犯了任何错误，任何人都可以感觉到纠正，上述建议取自我自己的经验。

谢谢＆amp;问候奈尔

jquery selector：检测deviant类

2 个答案: