javascript - jQuery,切换按钮显示加号或减号

标签 javascript jquery html


如何切换按钮以显示加号或减号?
按钮放大和缩小文本。如果文本很大...按钮是
减号,如果文本很小...按钮是加号等等。

昨天我在这方面得到了一些帮助,我仍在尝试学习 jQuery 并有点卡住。
感谢您的帮助,

<!DOCTYPE html PUBLIC ">
<head>
<script type="text/javascript" src="js/jquery-1.4.min.js"></script>
<script type='text/javascript'>
  var fontSizes = [14, 16]

$(function(){
  $('input').click(function() {
    $('p').css('font-size', fontSizes[0] + 'pt');
    fontSizes.reverse();
var currFontSize = ourText.css('fontSize');
var finalNum = parseFloat(currFontSize, 10);
var stringEnding = currFontSize.slice(-2);
if(this.id == 'large') {
finalNum *= 1.2;
}
else if (this.id == 'small'){
finalNum /=1.2;
}
ourText.css('fontSize', finalNum + stringEnding);
});
});
</script>
</head>

<body>
<h2>Toggle Size? </h2>

<!--TOGGLE BUTTON NEEDS TO CHANGE FROM PLUS TO MINUS-->
<input type='button' value='+' id='small' />


<p>My Text!!!</p>
</body>
</html>

最佳答案

mahesh's answer 更进一步,使用 $().toggle(function, function):

var fontSizes = [14, 16];

$(function(){
    $('#PlusMinus').toggle(function() {
        $('#OurText').css('fontSize', fontSizes[1] + 'pt');
        $(this).val("-");
    }, function() {
        $('#OurText').css('fontSize', fontSizes[0] + 'pt');
        $(this).val("+");
    });
});

关于javascript - jQuery,切换按钮显示加号或减号,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5196745/

相关文章:

jquery - Css 选择器没有像我预期的那样工作

html - 保存 html Canvas 图像

javascript - 用 Javascript 在棋盘上画箭头

javascript - Webpack 正在从我机器的全局 `node_modules` 导入模块。如何让它只从我项目的 `node_modules` 导入?

javascript - 为什么这个简单的 javascript/jquery 代码不能提醒选定的文本?

javascript - 关闭 json 数据填充表

jquery - HTML5 Canvas,为每个矩形注册点击事件

javascript - 使用 Javascript 或 jQuery 警告 iframe 内的隐藏文本

javascript - 向网站添加增强功能(无论是通过 C#、Chrome 扩展等)——不确定什么可行?

javascript - 为什么 jQuery 聊天机器人的这段代码不起作用?