0

我正在学习 jQuery,我有这个代码:

 echo "<table border=1>                 
    <tr><th class='col1'>Mã Sinh Viên <a href='javascript:void(0)' data-page='$page' data-field='stuId' data-sort='$sort' data-key='$key'><img src='downArrow.gif'></a></th>
        <th class='col2'>Họ tên <a href='javascript:void(0)' data-page='$page' data-field='stuName' data-sort='$sort' data-key='$key'><img src='downArrow.gif'></a></th>
        <th class='col3'>Ngày sinh  <a href='javascript:void(0)' data-page='$page' data-field='stuDoB' data-sort='$sort' data-key='$key'><img src='downArrow.gif'></a></th>
        <th class='col4'>Giới tính <a href='javascript:void(0)' data-page='$page' data-field='stuSex' data-sort='$sort' data-key='$key'><img src='downArrow.gif'></a></th>
        <th class='col5'>Địa chỉ <a href='javascript:void(0)' data-page='$page' data-field='stuAdd' data-sort='$sort' data-key='$key'><img src='downArrow.gif'></a></th>
    </tr>
";

还有一些脚本:

$("#mainTable th a").click(function()   {
    var clicked= $(this);
    var page= clicked.data("page");
    var field= clicked.data("field");
    var sort= clicked.data("sort");
    var key= clicked.data("key");
    if(sort== 'up') {
        sort= 'down';
        clicked.html("<img src='downArrow.gif'>");
        clicked.attr("data-sort",sort);
    }
    else    { 
        sort= 'up';
        clicked.html("<img src='upArrow.gif'>");
    }
    showPage(page,field,sort,key);
});

我需要的是当点击图片时,它会改变图片。我使用.click事件和$(this)选择器来处理被点击的元素。但是当我点击图片时,它仍然是一样的。

我的代码有什么问题?我试过CTRL-ALT-j但没有错误。请帮帮我。

4

3 回答 3

1

尝试clicked.data("sort",sort);设置data-sort属性

$("#mainTable th a").click( function () { 
    var clicked = $(this);
    var page = clicked.data("page");
    var field = clicked.data("field");
    var sort = clicked.data("sort");
    var key = clicked.data("key");

    if (sort == 'up') {
        sort = 'down';
        clicked.html("<img src='downArrow.gif'>");
    } else {
        sort = 'up';
        clicked.html("<img src='upArrow.gif'>");       
    }
   clicked.data("sort",sort);
});

工作样本

于 2013-03-17T15:48:52.353 回答
0

你的桌子没有课。

在 javascript 代码中,您选择类mainTable的表,但该表不存在...

于 2013-03-17T15:37:52.640 回答
0

尝试通过 jQuery 选择锚数据:

$("#mainTable th a").click(function()   {
    var clicked= $(this);
    var page= clicked.attr("data-page");
    var field= clicked.attr("data-field");
    var sort= clicked.attr("data-sort");
    var key= clicked.attr("data-key");
    if(sort== 'up') {
        sort= 'down';
        clicked.html("<img src='downArrow.gif'/>");
        clicked.attr("data-sort",sort);
    }
    else    { 
        sort= 'up';
        clicked.html("<img src='upArrow.gif'/>");
    }
    showPage(page,field,sort,key);
});
于 2013-03-17T15:46:54.617 回答