數據雙向切換文本

Question

我想切換文本「顯示更多」和「顯示更少」數據，我的腳本幾乎可以工作，但我需要它不會停止，一旦它變成文本「顯示更少」並保持它持續切換「顯示更多」和「顯示更少」我在我的功能是缺少

這裏我的jsfiddle：？http://jsfiddle.net/Manna/3Ndcg/1/

<div class ="scorer_filter"> 
<a href="#" class="hide_full_list" data-less="Show Less" data-more="Show More" data-table-id="32301" id="toggle">Show More</a> 
</div> 

    $(function() { 
    $(".scorer_filter").on("click", ".hide_full_list", function(){ 
    var txt = "Show More" ? $('#toggle').data("less") : $('#toggle').data("more"); 
    $('#toggle').text(txt); 
}); 

}）;

Answer 1

你是不是測試「 txt「變量，你應該這樣做：

var txt = $('#toggle').text(); 
txt = (txt == "Show More") ? $('#toggle').data("less") : $('#toggle').data("more"); 

http://jsfiddle.net/3Ndcg/2/

Answer 2

Here you go：

$(function() { 
    $(".scorer_filter").on("click", ".hide_full_list", function(){ 
     var txt = $(this).text() == "Show More" ? $(this).data("less") : $(this).data("more"); 
     $(this).text(txt); 
    }); 
    }); 

Answer 3

var txt = "Show More" ? $('#toggle').data("less") : $('#toggle').data("more");

壞了，它會始終把 「顯示更多」 以TXT。嘗試這樣的代替：

$(function() { 
     $(".scorer_filter").on("click", ".hide_full_list", function(){ 
      if ($('#toggle').data("less")) { 
       $('#toggle').data("less",false).text("Show less"); 
      } else { 
       $('#toggle').data("less",true).text("Show more"); 
      } 
     }); 
    });