My code is available below, and here: http://jsfiddle.net/fRpCy/
var input = [];
input.push($('input'));
$(input).live('keydown', function (event) {
console.log('You have pressed a key!');
});
I would expect this code to respond to keypresses in the console. For some reason, it doesn't. What is the problem with this code? (Note: I know how to fix it, I just don't know what is wrong with it!)
Your code is expecting the $() function to take an array of jQuery objects as an argument. You essentially have this:
$([$('input')])
Per this jQuery documentation, I don't think it supports that. The jQuery function will take:
Important to note is that it will NOT take an array of jQuery objects. An element array is not the same thing as a jQuery object array, though you can obtain an element array from a jQuery object with the makeArray() method if you really wanted to.
There are several alternatives that would work:
The simplest is to not save any intermediary value:
$('input').live('keydown', function (event) {
console.log('You have pressed a key!');
});
This one gets an actual DOM element into the input array so the input array is a type of array that the jQuery function supports (though I can think of no reason to actually use this code):
var input = [];
input.push($('input').get(0));
$(input).live('keydown', function (event) {
console.log('You have pressed a key!');
});
Or, if there are multiple input values, just save the jQuery object for future use:
var inputs = $('input');
inputs.live('keydown', function (event) {
console.log('You have pressed a key!');
});
Or, if you want an element array, you can get that like this:
var input = $('input').makeArray();
$(input).live('keydown', function (event) {
console.log('You have pressed a key!');
});
Or, if what you really have is an array of jQuery objects and you want to combine those together into a new single jQuery object, this is one way to do that:
// var input is an array of jQuery objects you already have
var allElements = []; // new empty array of DOM elements
// iterate over array of jQuery objects getting array of DOM elements from each
for (var i = 0; i < input.length; i++) {
allElements = allElements.concat($.makeArray(input[i]));
}
$(allElements).live(...)
Or, a bit simpler way to do it:
var items = $.map(input, function(item, index) {return($.makeArray(item));});
$(items).live(...)
Or, now I've found the .add() method on a jQuery object:
var $items = input[0]; // grab first jQuery object in array
for (var i = 1; i < input.length; i++) {
$items.add(input[i]); // add other ones onto it
}
$items.keydown(function() {...});
Incidentally, I'm finding the the array of DOM elements doesn't work with .live('keydown'). I don't know why. It works with:
$(items).keydown(...)
And, since you have an array of DOM elements that already exist, there is no reason to use .live() anyway. You can just use .keydown().
jsFiddle working here: http://jsfiddle.net/jfriend00/qen2m/.
.autocomplete() works fine, why shouldn't .live() also work?Pretty sure you need to add .each to iterate through the array of objects
jQuery.each(arr, function() {
$(this).live('keydown', function (event) {
console.log('You have pressed a key!');
});
});
It seems like you're creating an array (var input) which has a single element. Element 0 contains an array - returned by $('input') - because you almost certainly have multiple inputs on your page.
Can you try
$('input').live('keydown', function (event) {
console.log('You have pressed a key!');
});
(untested)
