Question

我正在尝试从一个跨度内的表中提取每个字母。这就是我所拥有的：

<?php
    $y='A';
    $c=0;
    $z=0;
    echo "<table id=tableexample>";
    while ($z<100){
        $c=0;
        echo "<tr>";
        while ($c<3) {
            if (isset($names[$z])){              
                echo "<td><span id=boldinfo>".$y."</span><br></td>";    
            }      
            $y++;
            $c++;
            $z++;
        }

    }
    echo("</tr>\n");
    echo "</table>";
?>

所以我有多个重复的span类，我想使用jQuery / JS来解析它们并获取每个值。

这是我的JS：

$(document).ready(function () {
    $('.c3-legend-item-event').mouseover(function(){
        var colorKeyLength = $(this).closest("g").attr('class').length;
        var colorKey = $(this).closest("g").attr('class')[colorKeyLength-1];
        var colorKey2 = '';

        while (colorKey != colorKey2){
            colorKey2 = $( "table" ).find('#boldinfo').text();

        }

    });
});

在JS中，变量colorKey将是A，B，C，..或Z.在PHP中，变量y执行相同的操作并将其字母增加为它循环通过。

我的问题是能够解析具有相同span类和不同文本的循环。我不确定我该如何说出来。我知道我可以使用next（），但我不确定如何通过多次迭代来做到这一点。我试图这样做，当我将鼠标悬停在某物上时，包含与colorKey相同字母的单元格将以与其他单元格不同的颜色突出显示。

Answer 1

如果你肯定知道你只会看<span id="boldinfo"></span>格式的跨度（我鼓励在这里使用class而不是id），可以使用像$("span[id=boldinfo]")这样的简单jQuery选择器来只是循环遍历所有这些。

Answer 2

属性id应该与唯一元素相关，您应该使用属性class。设置没有引号的属性也不是一个好习惯（只有在你有一个属性时它才有效）。以下是修改：

<?php

    $y = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
    $z = 0;

    // could also be "<table id=\"table\">" 
    echo '<table id="tableexample" ' .
    'cellpadding="0" cellspacing="0" border="0" ' .
    'style="width:100%;">';

    while ($z < 100)
    {
        $c = 0;
        echo '<tr>';

        while ($c < 3)
        {
            if (isset($names[$z]))
            {              
                echo
                '<td align="left" valign="top">' .
                  '<span class="boldinfo">' .
                  $y[$z] .
                  '</span>' .
                '</td>';    
            }
            if ($z >= strlen($y) - 1)
            { $z = 0; }
            else
            { $z++; }

            $c++;
        }
        echo '</tr>';
    }
    echo "</table>";
?>

然后我不确定你是否想要使用你的JS代码，但这是我的新版本：

jQuery(document).ready(function($)
{
    $('.c3-legend-item-event').mouseover(function()
    {
        var colorKeyLength = $(this).closest("g").attr('class').length;
        var colorKey = $(this).closest("g").attr('class')[colorKeyLength-1];
        var colorKey2 = '';
        var spans = $('#tableexample .boldinfo');

        spans.each(function(index)
        {
            var txt = $(this).text();

            if (colorKey == txt)
            {
                // do something
                return false;
            }
        });
    });
});

希望它有所帮助！

不断寻找下一个元素jQuery / JS

2 个答案: