2018-12-28如何利用jQuery启动其他按钮方法

现在,Large Print按钮开始生效了。接下来,我们要以类似的方式处理其他两个按钮(Default和Narrow),让它们也都执行各自的任务。这个过程很简单,即分别使用.on()为它们添加一个单击处理程序,同时视情况移动或添加类。完成之后的代码如下面所示:

('#switcher-default').on('click',function(){
('body').removeClass('large');
});
('body').addClass('narrow');
('#switcher-large').on('click',function(){
('body').addClass('large');
});
});

以下是配套的narrow类的CSS规则:

body .narrow .chapter{
width:250px;
}

现在,如果单击Narrow Column按钮,随着相应的CSS生效,文本会相应变化。

单击Default按钮将从标签中同时移除两个类,让页面恢复为初始状态。

你可能感兴趣的:(2018-12-28如何利用jQuery启动其他按钮方法)