$('.fav').live('click', function(e){
$(this).toggleClass('highlight');
//increase the number by 1
html:
<li class="fav light_gray_serif">5</li>
how can i use jquery to i开发者_JAVA技巧ncrease the number between the li everytime its clicked? thanks
var num = parseInt($.trim($(this).html()));
$(this).html(++num)
You want to take a look at .html()
or .text()
. Here is an example:
$(this).text(function(i, t) {
return Number(t) + 1;
});
HTML:
<span id="counter">0</span>
jQuery:
$('#counter').text(Number($('#counter').text())+1);
You can increase the counter when clicking an existing button like this:
$(document).on('click','#your-button', function(){
$('#counter').text(Number($('#counter').text())+1);
});
Just use a plugin.
(function($) {
$.extend($.fn, {
"addOne": function() {
var num = parseInt(this.text(), 10);
this.text(++num);
},
"subtractOne": function() {
var num = parseInt(this.text(), 10);
this.text(--num);
}
});
}(jQuery))
Then call
$(".fav").live("click", function(e) {
$(this).toggleClass("highlight").addOne();
});
精彩评论