jQuery有條件地添加/刪除onlick和onserverclick屬性

Question

我正在開發一個c＃項目。

我有一個錨標記，我想基於某些條件添加/刪除onlick和onserverclick屬性。

設計： -

<a class="btnSelected" href="#" name="Platinum" onclick="if (!confirm('Are you sure you want to change the plan?')) return false;" onserverclick="UpdatePackage_Click" runat="server">upgrade</a> 

的jQuery： -

if ($("#" + '<%= hdnPackType.ClientID %>').val() != $("#" + '<%= hdnOrigionalPackType.ClientID %>').val()) {   
     $('a.btnSelected').html('select').attr("onclick", "if (!confirm('Are you sure you want to change the plan?')) return false;"); 
     } 
     else { 
      $('a.btnSelected').html('<i class="fa fa-check mr-10"></i>selected').removeAttr('onclick').removeAttr('href'); 
     } 

Answer 1

使用數據屬性是你的需要。我爲你做了一個例子。

<div class="row text-center"> 
<div class="col-md-4"> 
    plan 1 
    <button class="btn btn-info btnSelect" data-plan="1">select</button> 
</div> 
<div class="col-md-4"> 
    plan 2 
    <button class="btn btn-info btnSelect" data-plan="2">select</button> 
</div> 
<div class="col-md-4"> 
    plan 3 
    <button class="btn btn-info btnSelect" data-plan="3">select</button> 
</div> 

$(".btnSelect").on("click", function() { 
    $(".btnSelect").removeClass("btn-success"); 
    $(this).addClass("selected").addClass("btn-success").removeClass("btn-info"); 
    $("#result").text("Plan " + $(this).attr("data-plan") + " selected"); 
}); 

codepen demo