Javascript jQuery单击事件不工作？

在我工作的站点上实现之前，我正在测试JSFIDLE中的一些布局编码。不确定这是否是一个特定于JSFIDLE的问题，但三角形上的单击事件似乎不起作用

这看起来很典型，所以我不确定问题是什么。我很确定JSFIDLE为您添加了$（document）.ready（..），但在任何一种情况下，当我自己添加它时，代码都不起作用，所以我认为这不是问题所在

---

有人能发现我遗漏了什么吗？谢谢

您缺少一个关闭

}

，它应该位于代码的最后一行的第二行-换句话说，您忘记关闭

else{…

条件。现在已修复：

此外，jQuery自动添加供应商前缀，因此您实际上可以将代码简化为以下内容：

var $MenuTriangle = $(".menu.triangle");
$MenuTriangle.click(function () {
    alert("click handler called");
    if ($(this).css("transform") == 'none') {
        $(this).css("transform", "rotate(90deg) translate(1px,1.5px)");
    } else {
        $(this).css("transform", "");
    }
});

---

事实上，我建议切换类而不是使用

.css（）

函数；）

检查javascript控制台（取决于您的操作系统/设备，通常是F12或“开发人员工具”或浏览器中的类似工具）：在

单击

处理程序函数定义的末尾缺少一个大括号

固定小提琴：

var$MenuTriangle=$（“.menu.triangle”）；
$MenuTriangle.单击（函数（）{
警报（“单击已调用的处理程序”）；
if（$（this.css（“transform”）=“无”）{
css（“变换”、“旋转（90度）平移（1px，1.5px）”；
$（this.css（“-webkit transform”，“旋转（90度）平移（1px，1.5px）”）；
$（this.css（“-moz transform”，“旋转（90度）平移（1px，1.5px）”）；
css（“-ms变换”，“旋转（90度）平移（1px，1.5px）”；
$（this.css（“-o-transform”，“旋转（90度）平移（1px，1.5px）”）；
}否则{
$（this.css（“transform”，”）；
$（this.css（“-webkit transform”，”）；
$（this.css（“-moz transform”，”）；
$（this.css（“-ms transform”，”）；
$（this.css（“-o-transform”，”）；
}})；//您只是错过了一个}来关闭末尾的else。最后一行应该是}}）；检查Javascript控制台，它会报告语法错误。如果从菜单中选择了
onDomReady
，那么jsiddle只会添加
$（document）.ready（）
。它默认为
window.onload
。啊，我太笨了。这可能是我在JSFIDLE中测试得到的结果，而不是真正的IDE。谢谢，伙计们！在否决票上：如果有人评论为什么答案不令人满意，我洗耳恭听。啊，我太傻了。这可能是我在JSFIDLE中测试得到的结果，而不是真正的IDE。谢谢事实上，如果你遇到问题，你应该首先尝试验证你的JS：）啊，我太笨了。这可能是我在JSFIDLE中测试得到的结果，而不是真正的IDE。谢谢
var $MenuTriangle = $(".menu.triangle");
$MenuTriangle.click(function () {
    alert("click handler called");
    if ($(this).css("transform") == 'none') {
        $(this).css("transform", "rotate(90deg) translate(1px,1.5px)");
    } else {
        $(this).css("transform", "");
    }
});

var $MenuTriangle = $(".menu.triangle");
$MenuTriangle.click(function () {
alert("click handler called");
if ($(this).css("transform") == 'none') {
    $(this).css("transform", "rotate(90deg) translate(1px,1.5px)");
    $(this).css("-webkit-transform", "rotate(90deg) translate(1px,1.5px)");
    $(this).css("-moz-transform", "rotate(90deg) translate(1px,1.5px)");
    $(this).css("-ms-transform", "rotate(90deg) translate(1px,1.5px)");
    $(this).css("-o-transform", "rotate(90deg) translate(1px,1.5px)");
} else {
    $(this).css("transform", "");
    $(this).css("-webkit-transform", "");
    $(this).css("-moz-transform", "");
    $(this).css("-ms-transform", "");
    $(this).css("-o-transform", "");
}}); // <== fixed this line