имеет ли элемент рамку
Здравствуйте, не могу решить элементарную задачу, есть страница с элементами. при щелчке на элемент у него появляется рамка, при повторном должна убираться.
<body> <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script> <p>1</p> <p>2</p> <p>3</p> <p>4</p> <script type="text/javascript"> $('p').css('border','none'); $('p').click(function(){ alert(3); if($(this).css('border')=='none') $(this).css('border','1px solid black'); else $(this).css('border','none'); }); </script> </body> Проую этот код, ничего не работает , если вызвать alert($(this).css('border')) элемента с границей, выдасться пустота. |
лучше используйте классы и переключайте их
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> <meta charset=utf-8 /> <title>Test</title> <style> .border { border: 1px solid black; } </style> </head> <body> <p>1</p> <p>2</p> <p>3</p> <p>4</p> <script> $('p').click(function () { $(this).toggleClass('border'); }); </script> </body> </html> |
да, спасибо, так работает:
if($(this).hasClass('sel0')) $(this).removeClass('sel0'); else $(this).toggleClass('sel0'); но всё ранво проблемма стрнаная |
если очень хочется использовать .css('border....')
то можно так <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script> <p>1</p> <p>2</p> <p>3</p> <p>4</p> <script type="text/javascript"> $('p').click(function(){ if($(this).css('border-left-style') !== 'solid') $(this).css('border','1px solid black'); else $(this).css('border','none'); }); </script> просто .css() возвращает то что возвращает getComputedStyle а там обычно все разбито на отдельные элементы |
Часовой пояс GMT +3, время: 16:28. |