如何將鏈接值從「選擇」更改爲「選擇」？

Question

這是我輸入：

<a id="choose" alt="554">Choose</a>

我怎樣才能獲得輸出點擊鏈接後「選擇」成爲「選擇了」再回到「選擇」後，點擊它再次？

我的預期輸出：

<a id="choose" alt="554">Choosen</a>

這裏是我的Ajax：

$(function(){ 
 
    
 
    $('#choose').live('click',function(){ 
 
      var $this = $(this); 
 
      var chapter_id = $this.attr('alt'); 
 

 
      if($this.hasClass('edu_level_active')){ 
 
       del_chapter(chapter_id,$this); 
 
      }else{ 
 
       if($this.hasClass('disabled')){ 
 
        return false; 
 
       }else{ 
 
        ins_chapter(chapter_id,$this); 
 
       } 
 
      } 
 

 
     }); 
 
    
 
    }); 
 

 
    function ins_chapter(chapter_id,$this) 
 
    { 
 
     $.ajax({ 
 
      type  : 'post', 
 
      url  : '/dashboard/choose/', 
 
      data  : 'chapter_id:'+chapter_id, 
 
      beforeSend: function(){ 
 
       $this.addClass('edu_level_active'); 
 
      },error : function(){ 
 
       alert('error'); 
 
      } 
 
     }); 
 

 
     return false; 
 
    }

Answer 1

在jQuery 1.7中，.live()方法已經過時了。使用.on()附加事件處理程序。嘗試這個：。

$('#choose').on('click',function(){ 
     var $this = $(this); 
     var chapter_id = $this.attr('alt'); 
     var a_text = $this.text().trim(); 

     if(a_text=="Choose"){ 
      $this.text('Choosen'); 
     } 
     else{ 
      $this.text('Choose'); 
     } 


     if($this.hasClass('edu_level_active')){ 
      del_chapter(chapter_id,$this); 
     }else{ 
      if($this.hasClass('disabled')){ 
       return false; 
      }else{ 
       ins_chapter(chapter_id,$this); 
      } 
     } 

    }); 

Answer 2

很簡單，只是測試文本的當前值，並相應地改變它：

$('#choose').live('click',function(){ 
    var $this = $(this); 
    var chapter_id = $this.attr('alt'); 
    var chapter_text = $this.text().trim(); 

    if (chapter_text === 'Chosen') { 
     $this.text('Choose'); 
    } else if (chapter_text === 'Choose') { 
     $this.text('Chosen'); 
    } 

    if ($this.hasClass('edu_level_active')) { 
     del_chapter(chapter_id,$this); 
    } else{ 
     if ($this.hasClass('disabled')) { 
      return false; 
     } else{ 
      ins_chapter(chapter_id,$this); 
     } 
    } 
}); 

Answer 3

您可以定義一個布爾變量，其指示點擊或取消勾選。

var retVal = false 
 
$('#choose').on('click', function(){ 
 
if (!retVal){ 
 
    retVal = true; 
 
    $(this).text('Choosen'); 
 
} 
 
else { 
 
retVal = false; 
 
     $(this).text('Choose'); 
 
} 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<a id="choose" alt="554">Choose</a>