Necesito ayuda para agregar una clase a un div si tiene una imagen.
<div class="large-6 columns check-Div"> <div class="custom-table"> <div class="text"> <?php echo $latestimage; ?> </div> <div class="custom-table-box"> <?php echo $table; ?> </div> </div><!-- end custom-table --> </div> if ($j(".large-6.columns.check-Div > .custom-table-box:contains('size-full')")) { $j('.large-6.columns.check-Div').addClass("hasImage"); } El jQuery anterior agrega la clase hasImage a todos los divs, pero solo quiero que se aplique cuando hay un div que contiene una imagen. ¿Hay alguna manera de hacerlo individualmente? O por padre? Lo he intentado pero estoy un poco perdido.
¡Cualquier ayuda sería maravillosa!
CSS : tiene selector es lo que está buscando (aquí para un descendiente directo)
$('div:has(> img)').addClass("hasImage") //jquery wayo simplemente en css (pero esto requeriría un polyfill , ya que está en el Nivel 4, que actualmente es un borrador)
div:has(> img) { border-color: 1px solid red; }https://developer.mozilla.org/en-US/docs/Web/CSS/:tiene
JSfiddle aquí: https://jsfiddle.net/y6gtt2vg/1/
Compatibilidad con navegador
Acerca de la compatibilidad del selector de CSS
Independientemente de la compatibilidad de un navegador con los selectores CSS, todos los selectores enumerados en api.jquery.com/category/selectors/ devolverán el conjunto correcto de elementos cuando se pasen como argumento de la función jQuery.
Puede hacer esto eliminando la declaración if y simplemente agregando la clase basada en el selector : :has :
$j('.large-6.columns.check-Div:has(img)').addClass('hasImage');Puede hacer esto usando jquery sin necesidad de agregar si la condición
jQuery(".custom-table-box:has(img)").parents(".check-Div").addClass("hasImage");