javascript - Toggling button classes and text -
i trying change text , icons jquery. when click @ button changes, when click button again struggles. icon , text not change default.
code behind
string box = "<div class=\"alter-wrp\"> <div class=\"alert alert-danger {0}\">{1}</div></div>"; if(count > 0) litalert.text += string.format(box);
asp.page
<button class="btn btn-dangerr btn-lg" type="button"><span class="glyphicon glyphicon-bell beee"></span> <span class="text">show alarm</span> </button> <asp:literal id="litalert" runat="server"></asp:literal>
jquery
$('.btn-dangerr').click( function(e) { var tgl = $('.btn-dangerr'); var box2 = $('.alter-wrp'); var icon = $('.glyphicon'); var text = $('.text'); var toggleclass = '.beee'; icon.addclass('glyphicon-bell'); text.text('show alarm'); box2.slidetoggle(function (){ if (tgl.hasclass(toggleclass)) { icon.removeclass('glyphicon-bell').addclass('glyphicon-fire'); text.text('hide alarm'); } else { e.preventdefault(); } $('.btn-dangerr').toggleclass(toggleclass); }); });
pretty sure you're trying do:
$('.btn-dangerr').click(function (e) { $('.alter-wrp').slidetoggle(); $('.beee').toggleclass('glyphicon-bell glyphicon-fire'); if ($('.beee').hasclass('glyphicon-fire')) { $('.text').text('hide alarm'); } else { $('.text').text('show alarm'); } });
Comments
Post a Comment