【100%结帖】按钮点击后改变文字

Question

想做一个收藏按钮，刚开始文字是“收藏”，对应一个函数，点击后是文字是“取消收藏”，对应另外一个函数，要怎么实现？

Answer 1

<a href="javascript:void(0)" cid='123123123'  state="0" onclick = "fav(this)">收藏</a>function fav(o) {
var state = o.getAttribute('state');
var id = o.getAttribute('cid');
if(state == 0) {
o.innerHTML = '取消收藏';
add(id); //收藏
} else {
o.innerHTML = '收藏';
cancel(id); //取消收藏
}
}

Answer 2

add那里为什么要加个id？能否解释下？

Answer 3

没什么在js方法里要把 这个id元素的state属性改变，也可以在这里直接变
if(state == 0) {
        o.innerHTML = '取消收藏';
        add(id); //收藏
    } else {
        o.innerHTML = '收藏';
        cancel(id); //取消收藏
    }

Answer 4

设置一个flag，0或1 每次点击执行函数前加一个判断语句 ,像这样<a class="abc" href=""></a>
flag=0
if（flag=0）{
    $('.abc').val('取消收藏');
    /*执行收藏的方法*/
    flag=1;
}else{
    $('.abc').val('收藏');
    /*执行取消收藏的方法*/
    flag=0;
}

Answer 5

<input type="button" id="testButton" value="收藏" />$(document).ready(function () {
            $("#testButton").bind("click", Add());
        })        function Add() {
            //Do something Add
            alert("收藏");
            
            $("#testButton").val("取消收藏");
            $("#testButton").unbind("click");
            $("#testButton").bind("click", Cancel);
        }
        function Cancel() {
            //Do something Cancel
            alert("取消收藏");
            
            $("#testButton").val("收藏");
            $("#testButton").unbind("click");
            $("#testButton").bind("click", Add);
        }2楼的方法是在同一个函数中实现，我再写个每次点击绑定到不同函数的实现方法，用jQuery实现

Answer 6

引用JQuery      $(function () { 
            $("#FirstPinyin").toggle(function () {
                //点击第一次执行
                $(this).val("取消收藏");
                //doing
            }, function () {
                //点击第二次执行
                $(this).val("收藏");
                //doing
            });
        });

Answer 7

function fav(o) {
            var state = o.getAttribute('state');
            var id = o.getAttribute('cid');
            if (state == 0) {
                o.innerHTML = '取消收藏';
                o.setAttribute('state', 1);
                add(id); //收藏
            } else {
                o.innerHTML = '收藏';
                o.setAttribute('state', 0);
                cancel(id); //取消收藏
            }
        }    记得改变state属性 - -

Answer 8

这么改
function fav(o) {
    var state = o.getAttribute('state');
    var id = o.getAttribute('cid');
    if(o.innerHTML == '收藏') {
        o.innerHTML = '取消收藏';
        //alert("收藏");
        state = 1;
        add(id); //收藏
    } else {
        o.innerHTML = '收藏';
        cancel(id); //取消收藏
        
    }
}