как найти точное число из параметров URL внутри элемента td - PullRequest
Новая
       12

как найти точное число из параметров URL внутри элемента td

0 голосов
/ 17 декабря 2018

У меня проблема.Я не могу найти точные цифры из элемента td.Если я найду номер 25 для поиска, он также найдет номера 2 и 5 отдельно внутри элемента td.Я просто хочу, чтобы он нашел 25. То же самое с тем, что если я найду номер 10, он также выделит номер 1.

Вот JSfiddle: https://jsfiddle.net/mxcw0Lbr/

Вот код: HTML 

<table>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>10</td>
</tr>
<tr>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
<td>29</td>
<td>30</td>
</tr>
</table>

jQuery: 

var search = "?" + [
"number=" + encodeURIComponent("25") ];

$('td').filter(function() {
  return search.indexOf(parseInt($(this).text(), 10)) != -1;
}).addClass('active');

CSS: 

td {
color: #fff;
}

.picked {
color: #000;
}

.active {
color: #f30;
}

Заранее спасибо.

Ответы [ 2 ]

0 голосов
/ 17 декабря 2018

Вот еще один способ сделать это

Для каждого td вы проверяете, соответствует ли оно значению called int.Таким образом, не имеет значения, какой вызываемой переменной будет соответствовать URL-адрес, он будет непосредственно проверен.

JSFiddle: https://jsfiddle.net/mxcw0Lbr/3/

var search = "?" + [
  "called=" + decodeURIComponent("25")
  ].join("&");
  
$('td').filter(function() {
  return $(this).text() == search.match(/called=(\d+)/)[1];
}).addClass('active');
td {
	color: #fff;
	padding: 0px 5.4px;
	line-height: 42px;
}

.picked {
	color: #000;
}

.active {
	color: #f30;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<table>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>10</td>
</tr>
<tr>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
<td>29</td>
<td>30</td>
</tr>
</table>
0 голосов
/ 17 декабря 2018

Если вы введете номер 25 для поиска, он также найдет номера 2 и 5 отдельно внутри элемента td.Это связано с тем, что метод indexOf() возвращает первый индекс, по которому данный элемент может быть найден в массиве.Следовательно, обратный вызов в filter вернет true, даже если td имеет только 2.В противном случае он возвращает или -1.Если вы просто хотите, чтобы он нашел 25, вы можете сделать следующее: 

let $td=$('td');
$.each($td,function(){
  let $this=$(this)
  $this.toggleClass('active',$this.text()=='25');
});

ИЛИ

$("td:contains('10')").addClass('active');, если вы хотите меньше кода

...