select 如何在数据表中为不同的操作提供图像？

Question

我制作了一个数据表，每行包含数据项和两个图标图像，一个用于将项目标记为收藏，另一个图标用于通过单击报告未使用的项目。因此，有两种不同的操作取决于单击的图标。在jquery代码中标记为收藏

 $(document).ready(function() {
            var table = $('#myTable').DataTable();
             $('#myTable tbody').on( 'click', 'img', function () {
            //mark as favourite
             }

但这两个图标都适用，我如何区分它们？

Answer 1

您仅使用 img 标签选择了这两个。您需要添加一个类名来区分操作。

还有一个自定义数据属性，如数据 ID 属性，我们稍后可以使用它来识别目标项目（数据库 ID），并且可以在您使用 [=20= 填充 Datatable() 时添加它] () 或 php...

<img src="fav.png" class="fav" data-id="12"><img src="flag.png" class="flag" data-id="13">

并且在您的脚本中：

         $(document).ready(function() {
                    var table = $('#myTable').DataTable();
                     $('#myTable tbody').on( 'click', '.fav', function () {
                    //mark as favourite 
    //to use the ID of that item you need another row identifier for your function 
    var id=$(this).data('id');
                     }
                     $('#myTable tbody').on( 'click', '.flag', function () {
                    //Report that...
    var id=$(this).data('id');
                     }
});

Answer 2

阅读后我找到了解决方案https://api.jquery.com/multiple-selector/ 为图像指定不同的 class 名称，然后您就可以 select 它们。

<img class='fv'>

最喜欢的图标和

<img class='cs'>

对于审查图标，然后你可以 select 他们相应地。

$('#myTable tbody').on( 'click', 'img.fv', function () {
        //mark as favourite
         }
$('#myTable tbody').on( 'click', 'img.cs', function () {
        //mark as unapropiated
         }

就这些了。

select 如何在数据表中为不同的操作提供图像？

How select images for diferents actions in dataTable?

jquery

datatables

jquery-selectors