1

讲故事的时间。

所以，我有这个 HTML 代码：

<tr valign="top" class="">
    <td class="col-status status-yellow">&nbsp;</td>
    <td class="col-chk"><input name="ctl00" type="checkbox" class="checklistitem" title="Not Applicable" value="40" /></td>
    <td class="col-chk"><input name="ctl00" type="checkbox" class="checklistitem" title="Fixed" value="40" /></td>
    <td class="col-chk"><input name="ctl00" type="checkbox" class="checklistitem" title="OK" value="40" /></td>
    <td class="col-flag flag-red"><input name="ctl00" type="hidden" id="ctl00" value="True" /></td>
    <td class="col-question">8 (40).<a href="#" onclick="ChecklistNavigate('photos');return false;">link</a> <a href="#" onclick="showComments('40', 'ctl00');return false;">notes</a><input name="ctl00" type="hidden" id="ctl00" /></td>
</tr>

<tr valign="top" class="">
    <td class="col-status status-yellow">&nbsp;</td>
    <td class="col-chk"><input name="ctl00" type="checkbox" class="checklistitem" title="Not Applicable" value="380" /></td>
    <td class="col-chk"><input name="ctl00" type="checkbox" class="checklistitem" title="Fixed" value="380" /></td>
    <td class="col-chk"><input name="ctl00" type="checkbox" class="checklistitem" title="OK" value="380" /></td>
    <td class="col-flag flag-notset"><input name="ctl00" type="hidden" id="ctl00" value="True" /></td>
    <td class="col-question">23 (380).<a href="#" onclick="ChecklistNavigate('photos');return false;">link</a> <a href="#" onclick="showComments('380', 'ctl00');return false;">notes</a><input name="ctl00" type="hidden" id="ctl00" /></td>
</tr>

<tr valign="top" class="">
    <td class="col-status status-yellow">&nbsp;</td>
    <td class="col-chk"><input name="ctl00" type="checkbox" class="checklistitem" title="Not Applicable" value="20" /></td>
    <td class="col-chk"><input name="ctl00" type="checkbox" class="checklistitem" title="Fixed" value="20" /></td>
    <td class="col-chk"><input name="ctl00" type="checkbox" class="checklistitem" title="OK" value="20" /></td>
    <td class="col-flag flag-red"><input name="ctl00" type="hidden" id="ctl00" value="True" /></td>
    <td class="col-question">6 (20).<a href="#" onclick="ChecklistNavigate('photos');return false;">link</a> <a href="#" onclick="showComments('20', 'ctl00');return false;">notes</a><input name="ctl00" type="hidden" id="ctl00" /></td>
</tr>

好吧，这只是一小部分代码。这些块中大约有 100 个（或者，我称之为“问题”）。在上面的示例中，有 3 个问题：问题 40、380 和 20。

我正在寻找的是标记问题的计数。在上面的示例中，有两个标记的问题：40 和 20。这由属性“flag-red”指示。到目前为止，我所拥有的是：

var flaggedRed2 = document.getElementsByClassName("flag-red");
window.alert(flaggedRed2.length);

这有效。然而！现在，棘手的部分：我真正要寻找的是标记问题的计数，但仅限于某些问题。例如，我不关心问题 40（或其他一些问题，就此而言）。我想忽略那个。我希望窗口警报说：1。

这可能吗？如您所见，“flag-red”类没有与之关联的问题编号，就像每个“tr”中的其他类一样。而且，不幸的是，我无法将它添加到 HTML 代码中。

提前感谢任何可能有一些见解的人。

4

2 回答 2

0

看看这里，使用 jquery：http: //jsbin.com/opesok/1/edit

代码

  var ignored = [40];
  //var ignored = [40, 20];    //another example
  var redFlagTotal = 0;

  $(".flag-red").each(function(){
    var re = /\((.*?)\)/;
    var text = re.exec($(this).siblings(".col-question").text())[1];
    if(ignored.indexOf(parseInt(text)) < 0)
      redFlagTotal++;
  });
  alert("Tot: "+redFlagTotal)
于 2013-06-05T21:52:35.520 回答
0

如果你想要一个没有 jQuery 的版本，我有一个应该可以工作的 jsFiddle。

http://jsfiddle.net/BradleyStaples/dmvXM/

var rejectQuestions = function(flagged, rejections) {

    var i = 0,
        flaggedLength = flagged.length,
        rejectionsLength = rejections.length,
        n = 0,
        questionNumber = null;
    flagged2 = nodeListToArray(flagged);

    for (i = 0; i < flaggedLength; i++) {
        questionNumber = flagged[i].previousSibling.previousSibling.querySelector('input').value;
        for (n = 0; n < rejectionsLength; n++) {
            if (rejections[n] === questionNumber) {
                flagged2.splice(i, 1);
            }
        }
    }

    return flagged2;
};

var nodeListToArray = function(nodeList){
    var arry = [],
        i = 0,
        len = nodeList.length;
    for (i = 0; i < len; i++) {
        arry.push(nodeList[i]);
    }
    return arry;
};

var flaggedQuestions = document.querySelectorAll('.flag-red'),
    rejections = ['40'],
    filteredQuestions = rejectQuestions(flaggedQuestions, rejections);

console.log(filteredQuestions);

需要注意的一点 - 返回的值是一个实际的数组，而不是 nodeList，因此您需要考虑到这一点。

于 2013-06-05T22:03:58.390 回答