javascript - 如何使数据表背景图像可点击

Question

我正在使用数据表，其中对于特定列，我需要将背景图像设置为可点击的。

我无法把它放在一起。我可以为文本做，但可以弄清楚需要如何为背景图像做。任何人都可以建议。

这是我的javascript->

$(document).ready(function(){
    var myArray=JSON.parse(document.getElementById("populateDT").innerHTML);
        $('#example').dataTable
        (
            {
                "sScrollY": "500px",
                "bPaginate": false,
                "bScrollCollapse": true,
                 aaData: myArray,

                "aoColumns":
                    [
                        { "mData": "Id"},
                        { "mData": "Label"},
                        { "mData": "CT"},
                        { "mData": "data"},
                        { "mData": "Updated"},
                        { "sClass": "center", "mData":"", "sDefaultContent": '<a href="" class="editor_save">"getimage"</a> '},
                        { "sClass": "editimage", "mData":"","sDefaultContent": '<a href="" class="editor_save">this</a> ' },
                        { "sClass": "deleteimage", "mData":""}
                    ]
            } );
    });

以下是我的 HTML

<table class="display" id="example" cellpadding="0" cellspacing="0" border="0">
<thead>
<ul>
    <li> <a href="addedit.jsp">Add Code Edit</a></li>
    <li> <a href="#">Import</a></li>
    <li> <a href="#">Export</a></li>
</ul>
<tr>
    <th>Id</th>
    <th>Label</th>
    <th>CT</th>
    <th>data</th>
    <th>UpdatedAt</th>
    <th></th>
    <th></th>
    <th></th>
</tr>
</thead>

<tbody>
<tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td class="getimage"></td>
    <td class="editimage"></td>
    <td class="deleteimage"></td>
</tr>
</tbody>
</table>

我想让 getimage、editimage 和 deleteimage 成为可点击的。我试图理解这个链接http://editor.datatables.net/release/DataTables/extras/Editor/examples/envelope_inline.html 但需要一些帮助。欣赏它。谢谢

http://jsfiddle.net/pratik24/bujfp/

Answer 1

这是一个将更改背景颜色的示例：

$(document).ready(function(){
    //handle the click
    $('td',this).click(function() {
        $(this).css( "background-color", "red" );
    });
});

或者

$(document).ready(function(){
    //handle the click
    $('td',this).click(function() {
        $(this).addClass( "panama-red" );
    });
});

我建议使用 .addClass 而不是 .css。