2013-05-14 67 views
0

我試圖在點擊時更新表格中某個字段的HTML。當它被點擊時,一個類被應用並且在'headerSortUp'和'headerSortDown'之間交替。點擊切換時更新元素的HTML

這是我到目前爲止有:

$(document).on('click', "table#archive-table thead tr th.headerSortUp", function(){ 
    $(this).html('Date <span class="ss-icon ss-gizmo">up</span>'); 
}); 

我還需要補充,所以如果類是「headerSortDpwn」是更新HTML到Date <span class="ss-icon ss-gizmo">down</span>

讓我知道如果你能幫助或如果我沒有說清楚。

感謝, [R

UPDATE

http://jsfiddle.net/Rx9pD/1/

回答

0

試試這個:

$('#archive-table ').on('click', "th", function() { 
    if ($(this).hasClass('headerSortUp')) $(this).html('Date <span class="ss-icon ss-gizmo">up</span>'); 
    else if ($(this).hasClass('headerSortDown')) $(this).html('Date <span class="ss-icon ss-gizmo">down</span>'); 
}); 
+0

感謝您的幫助。我覺得這應該工作,但它不更新HTML ... – 2013-05-14 10:32:09

+0

@rdck:發佈一個功能的例子,說明你的問題http://jsfiddle.net/然後我可以看看這個問題。 – 2013-05-14 12:27:05

+0

非常感謝 - http://jsfiddle.net/Rx9pD/1/ – 2013-05-14 15:47:47

0
$("table#archive-table thead tr th").click(function (e) { 

    if ($(this).hasClass("headerSortUp")){ 
     $(this).removeClass("headerSortUp"); 
     $(this).addClass("headerSortDown"); 
    } 
    else{ 
     $(this).removeClass("headerSortDown"); 
     $(this).addClass("headerSortUp"); 
     S(this).html('Date <span class="ss-icon ss-gizmo">down</span>'); 
    } 
}); 

在html()函數把,而不是整個完整的HTML是什麼你在你的問題中提供。我還假設headerSortUp類最初應用於您的th單元格。