¿Cómo utilizar variables de JavaScript en selectores de jQuery?
¿Cómo uso variables de JavaScript como parámetro en un selector de jQuery?
<script type="text/javascript">
$(function(){
$("input").click(function(){
var x = $(this).attr("name");
$("input[id=x]").hide();
});
});
</script>
<input type="text" id="bx"/><input type="button" name="bx"/>
<input type="text" id="by"/><input type="button" name="by"/>
Básicamente lo que quiero hacer es poder ocultar el elemento que tiene un id
nombre igual al elemento en el que se hace clic.
var name = this.name;
$("input[name=" + name + "]").hide();
O puedes hacer algo como esto.
var id = this.id;
$('#' + id).hide();
O también puedes darle algún efecto.
$("#" + this.id).slideUp();
Si desea eliminar todo el elemento de forma permanente, forme la página.
$("#" + this.id).remove();
También puedes usarlo en esto también.
$("#" + this.id).slideUp('slow', function (){
$("#" + this.id).remove();
});
$(`input[id="${this.name}"]`).hide();
Como estás usando una identificación, esto funcionaría mejor
$(`#${this.name}`).hide();
Recomiendo encarecidamente ser más específico con su enfoque para ocultar elementos mediante clics en botones. Yo optaría por utilizar atributos de datos en su lugar. Por ejemplo
<input id="bx" type="text">
<button type="button" data-target="#bx" data-method="hide">Hide some input</button>
Luego, en tu JavaScript
// using event delegation so no need to wrap it in .ready()
$(document).on('click', 'button[data-target]', function() {
var $this = $(this),
target = $($this.data('target')),
method = $this.data('method') || 'hide';
target[method]();
});
Ahora puedes controlar completamente a qué elemento te diriges y qué le sucede a través del HTML. Por ejemplo, podría utilizar data-target=".some-class"
y data-method="fadeOut"
para atenuar una colección de elementos.
$("input").click(function(){
var name = $(this).attr("name");
$('input[name="' + name + '"]').hide();
});
También funciona con identificación:
var id = $(this).attr("id");
$('input[id="' + id + '"]').hide();
cuando, (a veces)
$('input#' + id).hide();
no funciona como debería .
Incluso puedes hacer ambas cosas:
$('input[name="' + name + '"][id="' + id + '"]').hide();
var x = $(this).attr("name");
$("#" + x).hide();