Onclick文本更改，然后显示图像jQUERY

Question

我花了几个小时在这个特定的代码，但似乎不适合我。基本上我试图onclick按钮然后更改文本从签署到签署成功与条件如果签到成功然后显示图像，否则设置图像显示：无。

你可以试着帮我解决这个问题，谢谢。

HTML：

<div class="checkLevel" id="damonkEYkEY"> 
    <span data-bind="css: safeLevelClass"> </span> 
    <a href="#" id="checkLevelBtn">签到</a> 
    <img src="images/Calendartest.png" alt="" class="calendarshow" style="display:none"> 
</div> 

的jQuery：

$(document).ready(function() { 
    $("#damonkEYkEY").click(function(e) { 
     e.preventDefault(); 
     $(".checkLevel a").text(function(i, t) { 
      return t == '签到' ? '签到成功' : '签到'; 

     }); 
     if($(".checkLevel a").text('签到成功')){ 
     $(".calendarshow").css("display", "block");} 
     else{ 
     $(".calendarshow").css("display", "none");} 
     } 
    }); 
}); 

CSS：

.calendarshow { 
    display: inline-block; 
    bottom: -180px; 
    position: absolute; 
    left: 118px; 
} 

Answer 1

有一个多余的右大布拉克et在你的代码中。因此删除它并用if($(".checkLevel a").text()=='签到成功'){替换if($(".checkLevel a").text('签到成功')){。

请检查下面的代码段。

$(document).ready(function() { 
 
    $("#damonkEYkEY").click(function(e) { 
 
    e.preventDefault(); 
 
    $(".checkLevel a").text(function(i, t) { 
 
     return t == '签到' ? '签到成功' : '签到'; 
 

 
    }); 
 

 
    if($(".checkLevel a").text()=='签到成功'){ 
 
     $(".calendarshow").css("display", "block");} 
 
    else{ 
 
     $(".calendarshow").css("display", "none");} 
 
    }); 
 
});

.calendarshow { 
 
    display: inline-block; 
 
    bottom: -180px; 
 
    position: absolute; 
 
    left: 118px; 
 

 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="checkLevel" id="damonkEYkEY"> 
 
    <span data-bind="css: safeLevelClass"> </span> 
 
    <a href="#" id="checkLevelBtn">签到</a> 
 
    <img src="images/Calendartest.png" alt="" class="calendarshow" style="display:none"> 
 
</div>

Answer 2

$(document).ready(function() { 
 
    $("#damonkEYkEY").click(function(e) { 
 
    e.preventDefault(); 
 
    $(".checkLevel a").text(function(i, t) { 
 
     return t == '签到' ? '签到成功' : '签到'; 
 

 
    }); 
 

 
    if ($(".checkLevel a").text() == '签到成功') { 
 
     $(".calendarshow").css("display", "block"); 
 
    } else { 
 
     $(".calendarshow").css("display", "none"); 
 
    } 
 

 
    }); 
 
});

.calendarshow { 
 
    display: inline-block; 
 
    bottom: -180px; 
 
    position: absolute; 
 
    left: 118px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="checkLevel" id="damonkEYkEY"> 
 
    <span data-bind="css: safeLevelClass"> </span> 
 
    <a href="#" id="checkLevelBtn">签到</a> 
 
    <img src="images/Calendartest.png" alt="" class="calendarshow" style="display:none"> 
 
</div>

你有多余的}