javascript - 无法使 if else jquery 语句工作

标签 javascript jquery css

我在下面的js中添加了代码。当您单击“注册”或“登录”时,箭头会移动/指向上方,但当您再次关闭它时,它会保持原样。谁能帮我弄清楚该怎么做。

我试过使用这篇文章,但也无法使它起作用 here

这是我使用的 Jquery 脚本

$(document).ready(function () {
        $('#login-trigger').click(function () {
            $('#login-content').slideToggle();
            $(this).addClass('active');
            if ($(this).hasClass('active')) $(this).find('span').html('▲');

            $('#signup-content').slideUp();
        })
        $('#signup-trigger').click(function () {
            $('#login-content').slideUp();
            $(this).addClass('active');
            if ($(this).hasClass('active')) $(this).find('span').html('▲');

            $('#signup-content').slideToggle();
        });
    });

这是我的 jsfiddle ,(我知道有些人不喜欢 jsfiddle,但因为我有很多代码,而且显示我正在尝试用它做什么会容易得多)

最佳答案

问题是,因为您正在向它添加事件类,在单击事件时..紧接着,您正在检查它是否有一个事件类(这总是正确的)...

使用 toggleClass(它切换提到的类)而不是 addClass 并检查 hasClass

 $(document).ready(function () {
    $('#login-trigger').click(function () {
         $('#login-content').slideToggle();
         $(this).toggleClass('active');
         if ($(this).hasClass('active')){              
             $(this).find('span').html('▲');
        }else{
           $(this).find('span').html('▼'); 

        }
        $('#signup-content').slideUp();
     });
    .... //same for signup

fiddle here

是的 我知道有些人不喜欢 jsfiddle .. 我猜你错了,我相信大多数人更喜欢 jsfiddle 而不是代码本身,因为它更容易在 fiddle 中测试。

关于javascript - 无法使 if else jquery 语句工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20374541/

相关文章:

Javascript/jQuery 绘制表格,其中包含具有特定颜色的单元格来计算方程

javascript - 多个 html 元素针对单个 js 事件

html - 在 IE 和 Firefox 上显示不一致

javascript - 使用 javascript 设置 session 变量

javascript - 如何使用 jquery 将 <td> 插入到 <tr>

javascript - 如果用户在 x 秒内没有按下按钮则执行函数

javascript - 防止在网页上多次滚动

html - <a href> 破坏文本格式

javascript - 在 angularjs 服务中缓存数组

javascript - jQuery 似乎同时运行多个调用