I am attempting to hide certain elements using the combination of keyup with contains. What I want to do is hide the span elements that do not equal my input values.
For instance, if I input the value 1 the spans containing the values 2 and 3 are hidden, leaving only the span containing the 1 visible. I would also want it to show all of the spans if I then deleted the 1 value from the input
Here is what I have so far, http://jsfiddle.net/8TXDM/36/
var $spans = $(".mydiv span");
$('.myinput').keyup(function() {
var val = this.value;
if (val) {
$spans.filter(':contains(' + val + ')').show();
$spans.filter(':not(:contains(' + val + '))').hide();
} else {
$spans.show();
}
});
Working demo: http://jsfiddle.net/8TXDM/38/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With