如何使用jQuery在Materialise设计中更改datepicker表单的背景颜色?

时间:2022-11-21 15:46:16

I'm using date picker in materialize design and I'm trying to change background-color using jQuery.

我在物化设计中使用日期选择器,我正在尝试使用jQuery更改背景颜色。

Materialize Calendar

I tried with this line and it doesn't work

我试过这条线,但它不起作用

$(".picker__weekday-display").css("color", "#FF0F0F", "important");

I need to use JavaScript because I have to change my color dynamically.

我需要使用JavaScript,因为我必须动态更改颜色。

3 个解决方案

#1


0  

Are you sure you added the javascript in your $(document).ready? If the calendar was not initialize it will not find your class.

您确定在$(文件).ready中添加了javascript吗?如果日历未初始化,则无法找到您的课程。

#2


2  

Your usage of $.css() is incorrect - and you'll also need to use background or background-color instead of color.

您对$ .css()的使用不正确 - 您还需要使用背景颜色或背景颜色而不是颜色。

You can write

你可以写

$(".picker__weekday-display").css("background-color", "#FF0F0F !important")

or

$(".picker__weekday-display").css({"background-color": "#FF0F0F !important"})

See the API:

查看API:

http://api.jquery.com/css/#css-propertyName-value

However, the API also states:

但是,API还声明:

Note: .css() ignores !important declarations. So, the statement $( "p" ).css( "color", "red !important" ) does not turn the color of all paragraphs in the page to red. It's strongly advised to use classes instead; otherwise use a jQuery plugin.

注意:.css()忽略!重要声明。因此,语句$(“p”)。css(“color”,“red!important”)不会将页面中所有段落的颜色变为红色。强烈建议使用类来代替;否则使用jQuery插件。

So you might be better off to add a class instead:

所以你可能最好添加一个类:

$(".picker__weekday-display").addClass("my-class");

CSS:

.my-class {
  background-color: #FF0F0F !important;
}

#3


0  

color is foreground (text) color. Use backgroundColor.

颜色是前景(文本)颜色。使用backgroundColor。

#1


0  

Are you sure you added the javascript in your $(document).ready? If the calendar was not initialize it will not find your class.

您确定在$(文件).ready中添加了javascript吗?如果日历未初始化,则无法找到您的课程。

#2


2  

Your usage of $.css() is incorrect - and you'll also need to use background or background-color instead of color.

您对$ .css()的使用不正确 - 您还需要使用背景颜色或背景颜色而不是颜色。

You can write

你可以写

$(".picker__weekday-display").css("background-color", "#FF0F0F !important")

or

$(".picker__weekday-display").css({"background-color": "#FF0F0F !important"})

See the API:

查看API:

http://api.jquery.com/css/#css-propertyName-value

However, the API also states:

但是,API还声明:

Note: .css() ignores !important declarations. So, the statement $( "p" ).css( "color", "red !important" ) does not turn the color of all paragraphs in the page to red. It's strongly advised to use classes instead; otherwise use a jQuery plugin.

注意:.css()忽略!重要声明。因此,语句$(“p”)。css(“color”,“red!important”)不会将页面中所有段落的颜色变为红色。强烈建议使用类来代替;否则使用jQuery插件。

So you might be better off to add a class instead:

所以你可能最好添加一个类:

$(".picker__weekday-display").addClass("my-class");

CSS:

.my-class {
  background-color: #FF0F0F !important;
}

#3


0  

color is foreground (text) color. Use backgroundColor.

颜色是前景(文本)颜色。使用backgroundColor。