Ahora uso jQuery para seleccionar algún elemento.

CÓDIGO:

<form class="form-horizontal" action="">
    <div class="form-group">
        <input type="text" name="key_word" class="form-control" value="">
        <button type="submit" class="btn btn-primary btn-bg-red">
            GO
        </button>
    </div>
</form>

Y tengo otra forma:

<form class="form-horizontal" action="">
    <div class="form-group">
        <input type="text" name="key_word" class="form-control" value="">
        <input type="text" name="test" class="form-control" value="">
        <button type="submit" class="btn btn-primary btn-bg-red">
            GO
        </button>
    </div>
</form>

¿Cómo seleccionar el primer formulario con jQuery? A saber, ¿cómo obtener un elemento sin un hijo especial?

-1
BlueRhino 11 dic. 2015 a las 12:30

3 respuestas

La mejor respuesta

Puede usar :not() (o not() ) y :has()

$('form:not(:has(input[name="test"]))').css('background', 'red');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form class="form-horizontal" action="">
  <div class="form-group">
    <input type="text" name="key_word" class="form-control" value="">
    <button type="submit" class="btn btn-primary btn-bg-red">
      GO
    </button>
  </div>
</form>
<form class="form-horizontal" action="">
  <div class="form-group">
    <input type="text" name="key_word" class="form-control" value="">
    <input type="text" name="test" class="form-control" value="">
    <button type="submit" class="btn btn-primary btn-bg-red">
      GO
    </button>
  </div>
</form>

$('form').not(':has(input[name="test"])').css('background', 'red');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form class="form-horizontal" action="">
  <div class="form-group">
    <input type="text" name="key_word" class="form-control" value="">
    <button type="submit" class="btn btn-primary btn-bg-red">
      GO
    </button>
  </div>
</form>
<form class="form-horizontal" action="">
  <div class="form-group">
    <input type="text" name="key_word" class="form-control" value="">
    <input type="text" name="test" class="form-control" value="">
    <button type="submit" class="btn btn-primary btn-bg-red">
      GO
    </button>
  </div>
</form>

Tenga en cuenta que :has no es CSS, es una adición de jQuery. (Se ha hablado de vez en cuando de agregarlo a CSS, pero no está en él [todavía]).

1
Pranav C Balan 11 dic. 2015 a las 09:45

Si está buscando un formulario que no tiene un elemento de entrada con la clase 'control de formulario' (la única diferencia que puedo ver entre ambos formularios), entonces

var result = $( ".form-horizontal" ).filter( function(){

   return $( this ).find( '.form-control' ).size() == 0;

} );
0
gurvinder372 11 dic. 2015 a las 09:36

Puede usar el siguiente selector:

$("form:not(:has([name='test']))");

Que solo seleccionará elementos form que no tengan descendientes con el nombre test.

Aquí está la demostración de trabajo de JSFiddle. Tenga en cuenta que la segunda forma es de color rojo, porque no tiene ningún elemento test.

0
Yeldar Kurmangaliyev 11 dic. 2015 a las 09:35