Question

我无需帮助即可解决问题。我有一个表与mysql / php while循环。和两个带有查询值的文本框，如

ignore

现在让我们说如果电话号码val-888和优先级val-0都与其他行完全匹配，那么所有匹配的行（tr）都会被类别称为class_matched。

到目前为止，我可以在stackoverflow的帮助下使用一个带文本框背景颜色的文本框。但无法弄清楚文本框和在tr中添加类。

<tbody>
<?php while($row = mysqli_fetch_assoc($result)){ ?>
<tr>
<td><input name="telephone_number" type="text" value="<?php echo $row['telephone_number'];?>"/></td>
<td><input name="priority" type="text"  value="<?php echo $row['priority'];?>" /></td>
<td>.....</td>
<td>.....</td>
</tr>
<?php }  ?>
</tbody>

提前感谢您的帮助。真诚地道歉，如果重复。

编辑：我也希望在两个文本框的更改事件上实现。

Answer 1

你需要两个循环
存储外循环val然后使用第二循环
如果与内部循环匹配，则添加类

$('#table1 tr').each(function(i, e) {
  var ot = $(this).find("input[name='telephone_number']").val();
  var op = $(this).find("input[name='priority']").val();
  var isMatched = false;
  $('#table1 tr').each(function(j, k) {
    if (j > i) {
      var it = $(this).find("input[name='telephone_number']").val();
      var ip = $(this).find("input[name='priority']").val();
      if (it == ot && ip == op) {
        $(this).addClass('class_matched');
        isMatched = true;
      }
    }
  });
  if (isMatched) {
    $(this).addClass('class_matched');
  }
});

.class_matched {
  background-color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<table id="table1">
  <tbody>
    <tr>
      <td><input name="telephone_number" type="text" value="888" /></td>
      <td><input name="priority" type="text" value="0" /></td>
    </tr>
    <tr>
      <td><input name="telephone_number" type="text" value="999" /></td>
      <td><input name="priority" type="text" value="0" /></td>
    </tr>
    <tr>
      <td><input name="telephone_number" type="text" value="888" /></td>
      <td><input name="priority" type="text" value="0" /></td>
    </tr>
  </tbody>
</table>

Answer 2

以下是我最后的表现。它为我工作我想要的。如果有人做得更好，我仍然会接受。感谢所有stackoverflow。

here is my JSfiddle:

＆＃13;

function find_match() {
var allName = []; 

$('#table1 tbody tr').each(function(index1, value1) {
  var tele_loop1 = $(this).find("input[name='telephone_number']").val();
  var priority_loop1 = $(this).find("input[name='priority']").val();
  var tel_p_loop1 = tele_loop1 +'-'+ priority_loop1;
  allName.push(tel_p_loop1);
});



$('#table1 tbody tr').each(function(index1, value1) {
  var tele_loop2 = $(this).find("input[name='telephone_number']").val();
  var priority_loop2 = $(this).find("input[name='priority']").val();
  var tel_p_loop2 = tele_loop2 +'-'+ priority_loop2;

var itemsFound = $.grep(allName, function (elem) {
                              return elem == tel_p_loop2;
                           }).length;						   
  if(itemsFound > 1){
	$(this).addClass('class_matched');
  }else{
	 $(this).removeClass(); 
  }

});
};


$(document).ready(function () {
        find_match();
          $('#table1 tbody tr').on('input', '.num_p', function() {
            $(this).attr('value',this.value)
        });
		$('#table1 tbody tr').on('input', '.num_p',find_match);
    });

＆＃13;

.class_matched {
background: #99FF32;
}

.sortable {
font-family: 'Open Sans', sans-serif;
  border-collapse: collapse;
  border: 1px solid #38678f;
  margin: 5px auto;
  background: white;
  animation: float 5s infinite;
}

.sortable th {
  background: steelblue;
  height: 35px;
  font-weight: bold;
  text-shadow: 0 1px 0 #38678f;
  color: white;
  border: 1px solid #38678f;
  box-shadow: inset 0px 1px 2px #568ebd;
  transition: all 0.2s;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<table id="table1" class="sortable">
<thead>
  <tr>
    <th width="6%"> Number</th>
    <th width="4%">Priority</th>
    </tr>
    </thead>
  <tbody>
    <tr>
      <td><input class="num_p" name="telephone_number" type="text" value="111" /></td>
      <td><input class="num_p" name="priority" type="text" value="0" /></td>
    </tr>
    <tr>
      <td><input class="num_p" name="telephone_number" type="text" value="222" /></td>
      <td><input class="num_p" name="priority" type="text" value="0" /></td>
    </tr>
    <tr>
      <td><input class="num_p" name="telephone_number" type="text" value="333" /></td>
      <td><input class="num_p" name="priority" type="text" value="0" /></td>
    </tr>
        <tr>
      <td><input class="num_p" name="telephone_number" type="text" value="111" /></td>
      <td><input class="num_p" name="priority" type="text" value="0" /></td>
    </tr>
        <tr>
      <td><input class="num_p" name="telephone_number" type="text" value="222" /></td>
      <td><input class="num_p" name="priority" type="text" value="0" /></td>
    </tr>
        <tr>
      <td><input class="num_p" name="telephone_number" type="text" value="444" /></td>
      <td><input class="num_p" name="priority" type="text" value="0" /></td>
    </tr>
        <tr>
      <td><input class="num_p" name="telephone_number" type="text" value="111" /></td>
      <td><input class="num_p" name="priority" type="text" value="1" /></td>
    </tr>
        <tr>
      <td><input class="num_p" name="telephone_number" type="text" value="333" /></td>
      <td><input class="num_p" name="priority" type="text" value="0" /></td>
    </tr>
        <tr>
      <td><input class="num_p" name="telephone_number" type="text" value="333" /></td>
      <td><input class="num_p" name="priority" type="text" value="2" /></td>
    </tr>
  </tbody>
</table>

＆＃13;

标记如果多个文本框值的组合在while循环表中匹配

2 个答案: