首页 > 解决方案 > 似乎无法弄清楚如何让 .toggle 函数在 jQuery 中工作,该库已包含在内,我有一个用于测试的 jsFiddle

问题描述

我似乎无法弄清楚为什么我的控制台日志或警报都没有在这个 jQuery 切换功能中工作。我有一段时间没有使用 jQuery,所以不确定我做错了什么,或者脚本包含是否存在配置问题。

这是 js 小提琴https://jsfiddle.net/anders_kitson/8ar9mvp4/1/

这是代码

var chart = Highcharts.chart('container', {
    credits: {
        enabled: false
    },

    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }],

    navigation: {
        buttonOptions: {
            enabled: false
        }
    }
});

const b = document.createElement('button');
b.textContent = ' ';
b.style.position = 'absolute';
b.style.right = "0px" 
b.style.top = '10px';
b.className = "toggleMe"
b.setAttribute("id", "buttonToggle");

$( "#buttonToggle" ).toggle(function() {
  alert( "First handler for .toggle() called." );
  console.log("test")
}, function() {
  alert( "Second handler for .toggle() called." );
  console.log("test1")
});

/* b.addEventListener('click', function () {
    chart.fullscreen.toggle();
    //b.classList.remove("toggleMe");
    //b.className = "toggleMeOff"
}); */

chart.container.appendChild(b);

标签: javascripthtmljquery

解决方案


我不知道您希望切换开关具有哪个功能。
此代码为您提供第二个处理程序警报。

$( "#container" ).after('<button id="buttonToggle">Click Me!</button>');

$( "#buttonToggle" ).toggle(function() {
  alert( "First handler for .toggle() called." );
  console.log("test")
}, function() {
  alert( "Second handler for .toggle() called." );
  console.log("test1")
});

推荐阅读