简体   繁体   English

jQuery show / hide div在Chrome中不起作用

[英]jQuery show/hide div dont works in Chrome

I'm a novice in jQuery. 我是jQuery的新手。 I have a a.acessaPonto if I click it, add/remove class a.acessaPonto.Selected and show/hide a div.AcessaPontoAtendimento . 如果单击它,我会有一个a.acessaPonto ,添加/删除类a.acessaPonto.Selected并显示/隐藏div.AcessaPontoAtendimento I have code like that. 我有这样的代码。 Works well in Firefox and IE but doesn't work in Chrome. 在Firefox和IE中效果很好,但在Chrome中不起作用。

  $( document ).ready(function() { $('.acessaPonto').click(function() { $(this).toggleClass('Selected'); if ($(this).hasClass('Selected')) $('.AcessaPontoAtendimento').css("display", "inline-block"); else $('.AcessaPontoAtendimento').css('display', 'none'); }); }); 
 .acessaPonto{ background-color:blue; } .acessaPonto.Selected{ background-color:red; } .AcessaPontoAtendimento{ display:none; background-color: red; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <a href="#" class="acessaPonto">Click</a> <div class="AcessaPontoAtendimento"> <p>Lorem ipsum dolor color</p> </div> </body> </html> 

Someone have a idea what's the problem in my code? 有人知道我的代码有什么问题?

$('.acessaPonto').click(function (e) {
    e.preventDefault();
    $(this).toggleClass('Selected');
    $('.AcessaPontoAtendimento').toggle( $(this).hasClass('Selected') );
});

In case your .acessaPonto is on an a tag, you need e.preventDefault() , otherwise not. 如果您的.acessaPonto a标签上,则需要e.preventDefault() ,否则不需要。

The code works fine. 该代码工作正常。 The real problem is in my chrome. 真正的问题出在我的chrome上。 I kill app and reopen again and well, the code Works! 我杀死了应用程序,然后重新打开,代码正常工作!

But I ajust some parts to works better with old code in application. 但是我只是调整了一些部分以使其与应用程序中的旧代码更好地配合。

$('.acessaPonto').click(function() {
    $(this).toggleClass('Selected');
    if ($(this).hasClass('Selected'))
    $('.AcessaPontoAtendimento').removeClass('hide'); // maybe you prefer .show();
    else
    $('.AcessaPontoAtendimento').addClass('hide'); // maybe you prefer .hide();
});

Tnx all for the support. Tnx全力支持。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM