在jQuery中检查是否设置了max-width？

Question

I'm trying to check if an inline style has already been applied by jQuery.

Normally, I would do something like this:

if ($(this).css('max-width') == '20%') {}

However, I don't know the percentage. What is the best way to check if there is any max-width applied?

Answer 1

By default .css('max-width') will return "none" if no max-width was defined, so the following condition should do the job:

if ($(this).css('max-width') !== 'none') { ... }

If you need to check for inline style only , meaning that you override the original max-width CSS property (eg from the stylesheet file), you may do the following:

if (this.style.maxWidth !== '') { ... }

... as pure maxWidth property of style will be empty "" if the CSS property was not set.

Answer 2

if ( $(this).css('max-width')!='none' ) { }

Answer 3

If on a element the max-width property is not applied then it will return none . Try to check none

$(this).css('max-width') =='none'

OR

if( $('#element').css('max-width') =='none' )  { 
 // max-width not EXISTS
} 
else
{
 // max-width EXISTS
}

Checking only the inline style :

if($('#element').attr('style') != 'undefined'){
 if( $('#element').attr('style').indexOf('max-width') == -1 )  { 
  // max-width not EXISTS
 } 
 else
 {
   // max-width EXISTS
 }
}
else
{
  // Inline style not EXISTS
}

OR

I recommend to use Jquery selector Attribute Contains Word Selector

$('div[style ~= "min-width:"]')

Working Fiddle