Question

是否可以删除jquery ui手风琴的下划线（text-decoration：none）？

我尝试了许多不同的解决方案，但似乎都没有。也许我没有选择合适的样式ID。

例如......

$('#accordion .ui-state-hover').attr('style', 'text-decoration:none');
$('#accordion .ui-state-focus').attr('style', 'text-decoration:none');
$('#accordion .ui-state-hover').css('text-decoration', 'none');

编辑：我知道我可以改变CSS样式表，但我只想为许多手风琴之一做这个。

EDIT2：这是实际代码......

<style type="text/css">
.myAccordion.ui-state-hover, .myAccordion.ui-state-focus {text-decoration:none !important;}
</style>

<!--Downtime Announcement begin-->
    <script type="text/javascript" language="javascript">
        $(document).ready(function() {
            $("#accordion").accordion({
                collapsible: true,
                active: false
            });
            $('#accordion .ui-icon').attr('style', 'display: none');
            $('#accordion .ui-accordion-header').attr('style', 'background:#A4000F');
            $('#accordion .ui-accordion-header a').attr('style', 'font-weight:bold;font-size:13px;color:white');
            $('#accordion .ui-accordion-content').attr('style', 'background:#A4000F;width:auto');
            $('#accordion .ui-accordion-content p').attr('style', 'font: 14px/16px Arial,Helvetica,sans-serif;color:white');
            $('#accordion .ui-state-hover').addClass('myAccordion');
            $('#accordion .ui-state-focus').addClass('myAccordion');

        });
    </script>

    <div id="accordion" >
        <h3><a href="#">Important Announcement</a></h3>
        <div>
            <p>Beginning at 6pm EDT on April 1st, 2011 our websites will be down for a system upgrade. Please return later in the weekend when the site will return to full availability.</p>
        </div>
    </div>
<!--Downtime Announcement end-->

Answer 1

您需要修改jQuery UI附带的stylesheet。

Answer 2

尝试：

$('#accordion .ui-state-hover').css('text-decoration','none');

在几条评论之后编辑：

当你不想修改所有手风琴时，只需创建新的css类即。 “myAccordion”，然后使用jquery将addClass添加到这两个选择器中。

$('#accordion .ui-state-hover').addClass('myAccordion');
$('#accordion .ui-state-focus').addClass('myAccordion');

修改样式表，如：

.myAccordion.ui-state-hover, .myAccordion.ui-state-focus {text-decoration:none;}

如果此规则不强，请修改：

.myAccordion.ui-state-hover, .myAccordion.ui-state-focus {text-decoration:none !important;}

Answer 3

从它的外观来看，似乎下划线是锚元素。所以，只需将其用作CSS：

#accordion .ui-accordion-header a {
    text-decoration: none;
}

或通过脚本：

$('#accordion .ui-accordion-header a').css('text-decoration','none');

我在jsFiddle上设置了这个快速演示：http://jsfiddle.net/93hw2。我相信这将在未来派上用场。

Answer 4

你试过这个：

$('#accordion .ui-state-hover').css('text-decoration', 'none');
$('#accordion .ui-state-focus').css('text-decoration', 'none');

请记住 AFTER 手风琴的负荷

在悬停时删除jquery手风琴的下划线

4 个答案: