JQuery 覆盖 themeroller 样式

发布于 2024-08-26 01:23:05 字数 177 浏览 11 评论 0原文

在我的手风琴控件中,如果该特定窗格中的用户控件(例如用户的名称和地址输入)返回 false 的验证布尔值,我想覆盖标题样式以显示红色背景而不是默认主题颜色。

我知道如何使用 .Toggle 来更改类,但不知道如何首先获取 themeroller 类。

我该怎么做?

谢谢

保罗

In my accordian control I want to override the header style to show a red background instead of the default theme colour if ever the user control (e.g user's name and address input) in that particular pane returns a validation boolean of false.

I'm ok with how to use .Toggle to change the class but can't figure out how to grab the themeroller class in the first place.

How would I do this?

Thanks

Paul

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

金橙橙 2024-09-02 01:23:05

假设您使用 jQuery Accordion

该类称为:.ui-accordion-header

因此,在验证返回 false 之后,

通过添加内联样式来设置新的背景颜色,如下所示:

$('.ui-accordion-header').attr('style','background:red');

然后删除它:

$('.ui-accordion-header').attr('style','');

UPDATE

假设您有这个 html 结构,

<div id="accordion">
    <h3><a href="#">Section 1</a></h3>
    <div>
        <p>
        ... <- if your form is here for es.: 
                   your path escalation to it's own H3 would be:

<!--\ $(this).parent('p').parent('div').prev(h3).attr('style','background:red') \-->

        </p>
    </div>
    <h3><a href="#">Section 2</a></h3>
    <div>
        <p>
     ...
        </p>
    </div>
</div>

其中 $(this) 引用空在if语句中输入!

if ( $('my_input').val() == '' )
$(this).parent().parent().prev().attr('style','background:red');

这应该按预期工作!

Assuming you are Using the jQuery Accordion

the class is called: .ui-accordion-header

so after the validation return false

set the new background color by adding inline style like this:

$('.ui-accordion-header').attr('style','background:red');

then for remove it:

$('.ui-accordion-header').attr('style','');

UPDATE

Assuming you have this html struct

<div id="accordion">
    <h3><a href="#">Section 1</a></h3>
    <div>
        <p>
        ... <- if your form is here for es.: 
                   your path escalation to it's own H3 would be:

<!--\ $(this).parent('p').parent('div').prev(h3).attr('style','background:red') \-->

        </p>
    </div>
    <h3><a href="#">Section 2</a></h3>
    <div>
        <p>
     ...
        </p>
    </div>
</div>

Where $(this) refer to the empty Input in the if statment!

if ( $('my_input').val() == '' )
$(this).parent().parent().prev().attr('style','background:red');

this should work as expected!

无声静候 2024-09-02 01:23:05

对此类内容进行逆向工程的一种有用方法是进入 Firefox 或 Chrome 等浏览器(其他浏览器也这样做,但这是我最常用的两个),右键单击该元素,然后选择“检查元素”。 ”这将为您提供格式良好(至少 Firefox 会对其进行格式化,我认为 Chrome 可能不会)的标记视图以及当前应用的样式。此外,该检查器还可以帮助您找出 CSS 规则不适用的原因等。您还可以动态创建新规则,这使得编辑-编译-测试循环更快。

A useful way of reverse-engineering something like this is to go into a browser like Firefox or Chrome (others do this as well, but these are the two I use most), right-click on the element, and select "Inspect Element." This will give you a nicely-formatted (at least Firefox formats it, I think Chrome might not) view of the markup, as well as currently applied styles. In addition, that inspector can help you figure out, for example, why your CSS rules aren't applying. You can also create new rules on the fly, which makes the edit-compile-test loop much faster.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文