Jquery 表排序不适用于图像
Jquery Table sorting not working with images
我有一个表格被php回显出来,
<table class="sortable">
<thead>
<tr>
<th>Player Name</th>
<th>Level</th>
</tr>
</thead>
<tbody>
<tr>
<td>Krack</td>
<td id="7" class="level">7</td>
</tr>
<tr>
<td>Lively</td>
<td id="6" class="level">6</td>
</tr>
<tr>
<td>Bamon Williams</td>
<td id="6" class="level">6</td>
</tr>
<tr>
<td>Sinister Char</td>
<td id="5" class="level">5</td>
</tr>
<tr>
<td>Senior BoomBox</td>
<td id="5" class="level">5</td>
</tr>
<tr>
<td>Blitzking</td>
<td id="4" class="level">4</td>
</tr>
<tr>
<td>Hadooooken</td>
<td id="2" class="level">2</td>
</tr>
<tr>
<td>Jumpman2392</td>
<td id="2" class="level">2</td>
</tr>
<tr>
<td>ALEC*</td>
<td id="2" class="level">2</td>
</tr>
<tr>
<td>Frokido</td>
<td id="2" class="level">2</td>
</tr>
<tr>
<td>B. McOxbig</td>
<td id="2" class="level">2</td>
</tr>
<tr>
<td>[MES] Koko</td>
<td id="1" class="level">1</td>
</tr>
</tbody>
<tfoot></tfoot>
</table>
然后<td id="1" class="level">1</td>
被一些javascript更改,以用图像代替"1"。
当用户单击其中一个,Pplayer 名称或级别时,它将按降序或升序对该列进行排序,但是当我在包含图像时对"级别"列进行排序时,它会混淆图像并且它们不会按正确的顺序排列(即 1,2,3,4,5,6,7 更像 5,6,2,7,3,1,4) JQuery 函数确实适用于整数和普通字符串,但我不知道如何对图像标记进行排序或处理
javascript库的链接在这里
我已经制作了最后一个问题的答案的新版本,其中包括这个新问题的解决方案,可在以下位置获得:https://jsfiddle.net/mdbdj895/1/
这会导致包含图片的<td>
元素获得具有适当值的 sorttable_customkey 属性(基于 <td>
的 id
属性),因为您使用的库似乎需要该属性。
现在的结果是,不仅在具有基于父<td>
的 id 属性的src
的 <td>
元素中创建图像,而且<td>
本身会获得具有正确值的新属性,如下所示:
<tr>
<td>Krack</td>
<td id="7" class="level" sorttable_customkey="7">
<img src="../img/CL7.png" alt="7">
</td>
</tr>
我看了一下那个库,似乎你必须使用自定义键
它会是这样的:
<td id="1" class="level" sorttable_customkey="1">1</td>
<td id="2" class="level" sorttable_customkey="2">2</td>
<td id="3" class="level" sorttable_customkey="3">3</td>
.................. And so on
相关文章:
- AddEventListener适用于浏览器,但不适用于Android
- 查找仅适用于原始图像的图像放大算法的名称
- 如何在category.php中执行jquery,这应该适用于类别wordpress中的每个帖子
- Web编程,简单但适用于机器人项目
- JavaScript不适用于internet explorer和Firefox,但适用于谷歌
- Jquery事件处理程序仅适用于匿名函数
- jQuery调整大小函数只适用于窗口
- Revolution Slider-适用于移动设备的懒虫图像
- 我如何完善这个Javascript代码,使其只适用于来自图像的链接(而不是来自文本的链接)
- Chrome壁纸API适用于某些图像,不适用于其他图像,没有明显的原因
- 在CKEditor中插入HTML不仅适用于图像
- 图像名称返回为未定义,但仅适用于某些图像
- 404 在离子/角度的ng重复上找不到图像,仅适用于第一个图像
- 将鼠标悬停在图像上以显示文本框,使用 JavaScript 仅适用于一个图像,因为我使用的是 getElementByI
- 函数适用于非动态加载的图像
- 为什么我的jQuery悬停函数只适用于一个图像
- CSS3的过渡只适用于背景图像
- iPad浏览器崩溃的问题(在下载约7 MB的图像时)是否也适用于音频文件?
- Javascript函数选择图像只适用于第一张图像
- 在 xhtml 中为正文元素设置背景图像(适用于不同的显示器和分辨率)