Question

我想在粗体和普通之间切换文字我为它制作了这个代码，但是当我打开页面时，粗体按钮消失了吗？

    $("#bold").toggle(function() {
    $('.focus').css("font-weight", $(this).val());
    }, function() {
    $('.focus').css("font-weight", "normal");
    });

我的代码有问题吗？请提前帮助，谢谢。

Answer 1

假设您正在使用jQuery 1.9或更高版本，则问题是.toggle() event handling method已从库中删除。所以你实际上称之为.toggle() function that hides/shows elements。（在早期版本的jQuery中，两个函数都存在，jQuery根据传入的参数找出了你的意思。）

您可以使用标准.click()处理程序轻松实现自己的切换：

$("#bold").click(function() {
   var f = !$(this).data("toggleFlag");
   if (f) {
      $('.focus').css("font-weight", $(this).val());
   } else {
      $('.focus').css("font-weight", "normal");
   }
   $(this).data("toggleFlag", f);
});

这使用.data() method来跟踪布尔标志以指示要执行的代码。第一次调用click处理程序时，标志将返回为undefined，因为它之前没有设置，但我们只是将其转换为带有!的布尔值（假设您要执行如果是第一次点击的其他情况。）

Answer 2

它消失了，因为不推荐使用该版本的切换，并且在较新版本的jQuery中，它所做的只是切换可见性。

你可以这样做：

var state = true;

$("#bold").on('click', function() {
    $('.focus').css("font-weight", state ? this.value : 'normal');
    state = !state;
});

FIDDLE

Answer 3

我点击后消失元素的唯一解决方案是切换效果完成后的回调功能。这里有一个解释Callback function的链接。

这是我的代码：

jQuery('.menu li.item-487').click(function(){
        jQuery('#main-menu .moduletable .menu li').toggle("slow",function(){jQuery('.menu li.item-487').css('display' , 'block');});

    });

当我在jquery中添加toggle事件时，为什么我的按钮会消失？

3 个答案: