jquery点击改变文字 比如点击 关注 后变成 取消关注

2022-07-26 社会 78阅读

先说一下思路吧:首先你需要绑定一个点击事件在按钮上,然后我们可以通过一个布尔型变量来记录状态,假设这个变量为假的时候,我们就显示取消关注,为真的时候就显示关注。当然你也可以,当变量为真的时候显示取消关注,假的时候显示取消关注。

我们现在用代码来讲解:

//假设该按钮有个id名为test,现在我们为它绑定一个事件
var v = false;//定义一个布尔型变量,来判断显示关注或取消关注
$( "#test" ).click( function() {//给按钮绑定点击事件
    if( v ) {    //如果为真的时候,我这里就显示关注
        $( this ).html( "关注" );
        v = false; //由于文字已更改,所以我们要改变变量的值
    } else {
        $( this ).html( "取消关注" );
        v = true;
    }
} );

解释一下运行过程,便于理解。

当程序第一次运行的时候,默认显示的是关注。所以在点击按钮后,会执行function里的代码。首先会判断v的值,这时v=false,所以会执行else里面的代码,按钮变成了取消关注,v=true。再次点击按钮,同上首先判断v的值,这时v=true,所以会执行if里面的代码,按钮就变成了关注。

到此就完成了点击文字的转换

声明:你问我答网所有作品(图文、音视频)均由用户自行上传分享,仅供网友学习交流。若您的权利被侵害,请联系fangmu6661024@163.com