1

我正在循环属于frag类的跨度元素。frag我想检测我当前所在的 frag 元素是否是属于class 和属于condclass 并且具有“if”或“else if”的 span 元素的最小儿子/孙子/孙子（从左到右）在其文本中

内容可编辑的 div (textarea)

if( ((b>0) && (b<10)) || b==15 )

等效的 HTML

<div id="board">
  <div>
  <span class="frag cond">if<span class="openParen bm1">(</span> <span class="frag cond"><span class="openParen bm2">(</span><span class="frag cond"><span class="openParen bm3">(</span><span class="frag">b</span>&gt;0<span class="closeParen bm3">)</span></span> && <span class="frag cond"><span class="openParen bm4">(</span><span class="frag">b</span>&lt;10<span class="closeParen bm4">)</span></span><span class="closeParen bm2">)</span></span> || <span class="frag">b</span>==15 <span class="closeParen bm1">)</span></span>
  </div>
</div>

（顺便说一下，我的系统就像一个代码编辑器，所以我使用了一个可内容编辑的 div）在这里，我想检测我是否在 3 号b。

byossarian帮我解决了这个问题：

var $elem = $('.frag').eq(fragNum);

var validAncest = $elem.parents('.cond').filter(function(i){
    return /^\s*(if|else\s+if)/.test($(this).text());
}).filter(function(i){
    var generations = 0,
    $elemCrawl = $('.frag').eq(fragNum);

    while ($elemCrawl[0] && $elemCrawl[0] !== this) {
        generations++;
        $elemCrawl = $elemCrawl.parent();
    }

    if ($elemCrawl[0] && generations < 4) {
        return true;
    }
});

找到元素的所有祖先，然后过滤一次以缩小到以“if”或“else if”开头的元素。然后，它将这些过滤为原始元素的父、祖父母或曾祖父母（世代 < 4）。

检查的条件是：

if (validAncest.length && !$elem.nextAll('.frag').length) {
    alert('target acquired');
}

它检查至少有一个有效的祖先 (validAncest.length) 并且原始元素是它的IMMEDIATE具有类“frag”的父元素的最后一个子元素 (!$elem.nextAll('.frag').length)

问题

IMMEDIATE parent 也应该是带有“if”或“else if”的元素的最后一个子/孙子

所以从上面的例子中，第一个b已经给了我第三个应该在哪里的警报b

UPDATE应该在第二次b而不是在(b<10)

在此处输入图像描述

4

1 回答 1

1

尝试更改validAncest：

var validAncest = $elem.parents('.cond').filter(function(i){
    return /^\s*(if|else\s+if)/.test($(this).text());
}).filter(function(i){
    var generations = 1,
    $elemCrawl = $('.frag').eq(fragNum).parent();

    while ($elemCrawl[0] && $elemCrawl[0] !== this) {
        if (!$elemCrawl.is(':last-child')) {return false;}
        generations++;
        $elemCrawl = $elemCrawl.parent();
    }

    if ($elemCrawl[0] && generations < 4) {
        return true;
    }
});

这应该包括：

  1. $elem 的父级提供它以 'if'/'else if' 开头
  2. 祖父母提供它以'if'/'else if'开头并且$elem的父母是这个祖父母的最后一个孩子
  3. 曾祖父母提供它以'if'/'else if'开头并且$elem的父母是中间祖父母的最后一个孩子并且祖父母是曾祖父母的最后一个孩子
于 2013-09-18T16:28:36.127 回答