Question

有人可以告诉我如何从表格列中找到最长的字符串？

例如：我需要找到td中带有name类的最长名称，如果名称长于50个字符，则执行其他操作。

<table>
  <thead>
    <th>name</th>
    <th>val1</th>
    <th>val2</th>
  </thead>
  <tbody>
    <tr>
      <td class="name">name short</td>
      <td class="first_value">val1</td>
      <td class="second_value">val2</td>
    </tr>
    <tr>
      <td class="name">name name name name</td>
      <td class="first_value">val1</td>
      <td class="second_value">val2</td>
    </tr>
    <tr>
      <td class="name">name name name name name name</td>
      <td class="first_value">val1</td>
      <td class="second_value">val2</td>
    </tr>
  </tbody>
</table>

CSS：

table {
  border: 1px solid black;
  width:100%;
  border-collapse: collapse;
}
td {
  border: 1px solid black;
}
.name {
  width:70%;
}
.first_value {
  width: 20%;
}
.second_value {
  width: 10%;
}

Answer 1

您可以使用.each()方法遍历每个名称元素，并使用此方法获取文本：

var longestName = "";
$('table td .name').each(function(){
    if($(this).val().length > longestName){
        longestName = $(this).val();
    }
});

然后你可以使用if语句来查看它是否超过50个字符：

if(longestName.length > 50){
    //do something
} else{
    // do this instead
}

Answer 2

试试这个

var maxlen=0;
var tdLongest;
$('table td .name').each(function(){
    if($(this).text().length > maxlen)
    {
        maxlen = $(this).text().length;
        tdLongest = $(this);
    }
});

tdLongest对象包含最长的名称文本td，因此您可以检查它的长度，而不是在您做任何想做的事情之后。

if(tdLongest.text().length > 50)
{
    //do something
}

Answer 3

只需迭代持有类＆＃34; name＆＃34;的每个元素。然后检查每行内容的长度，并保持最大值以跟踪当前最长的名称。然后，当您找到所有行时，请检查您当前最长的名称，并查看它是否超过50个。

var currentMax = -1;
var currentName = "";
    $(".name").each(function(index, value) {
        var nameValue = $(value).html();
        if(nameValue.length > currentMax) {
            currentMax = nameValue.length;
            currentName = nameValue;
        }
    });

    if(currentMax > 50) {
        //do stuff with currentName
    }

Answer 4

您可以使用正则表达式过滤来查找长度大于50的字符串：

pydot

Answer 5

“找到最长的”和“超过50个字符”之间存在差异。

您可以循环所有表格单元格并检查其值：

$(function() {
  var elem = $('table tbody td'),
      tr = 0,
      td = 0,
      l = 0;
  $.each(elem, function() {
    var cell = $(this),
        cellLength = cell.text().length;
    
    if( cellLength > l ) {
      l = cellLength;
      tr = cell.closest('tr').index();
      td = cell.index();
    }
  });
  $('#result').text( 'The longest value is inside row '+(tr+1)+' and column '+(td+1) );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <thead>
    <th>name</th>
    <th>val1</th>
    <th>val2</th>
  </thead>
  <tbody>
    <tr>
      <td class="name">name short</td>
      <td class="first_value">val1</td>
      <td class="second_value">val2</td>
    </tr>
    <tr>
      <td class="name">name name name name</td>
      <td class="first_value">val1</td>
      <td class="second_value">val2</td>
    </tr>
    <tr>
      <td class="name">name name name name name name</td>
      <td class="first_value">val1</td>
      <td class="second_value">val2</td>
    </tr>
  </tbody>
</table>

<div style="color:red" id="result"></div>

如果您想更改值超过50个字符的单元格，请使用：

$(function() {
  var elem = $('table tbody td');
  $.each(elem, function() {
    if( $(this).text().length > 50 ) {
      $(this).css('color', 'red');
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <thead>
    <th>name</th>
    <th>val1</th>
    <th>val2</th>
  </thead>
  <tbody>
    <tr>
      <td class="name">name short</td>
      <td class="first_value">val1</td>
      <td class="second_value">val2</td>
    </tr>
    <tr>
      <td class="name">name name name name</td>
      <td class="first_value">val1</td>
      <td class="second_value">val2</td>
    </tr>
    <tr>
      <td class="name">name name name name name name name name name name name name</td>
      <td class="first_value">val1</td>
      <td class="second_value">val2</td>
    </tr>
  </tbody>
</table>

<div style="color:red" id="result"></div>

jQuery：从表td中找到最长的字符串

5 个答案: