This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
jQuery each this
I have a loop that iterates over every element of a certain class:
$(".myclass").each(function(i) {
});
I'm trying to get children of that element with this.find("tag"), but it gives me an error. Inside that loop, what, does this refer to? What about $(this)?
this is the raw DOM node. If you want to use jQuery functions on it, you need to use $(this).
Related
This question already has answers here:
jQuery Button Click 'this'
(3 answers)
Closed 5 years ago.
$("#subPanel").click(function() {
$("#subPanel").removeClass('btn-success');// it works
this.addClass('btn-default'); it didn't works.
I would like to get self-dom object(in this case $("#subPanel") itself) from inside the call back.
It might be easy problem, so I try to googled around.
However I couldn't get straight answer.
could you help me ??
Inspect this and you will see it's not a jquery object but a DOM element which does not have an addClass method. Try:
$("#subPanel").click(function() {
$("#subPanel").removeClass('btn-success');// it works
$(this).addClass('btn-default')
})
Example: https://jsfiddle.net/14s0h3dr/
This question already has answers here:
Get an element by index in jQuery
(5 answers)
Closed 5 years ago.
I have a problem with the following code
var elements = $(".myClasses");
elements[1].animate({something}, 1000);
If I use $(".myClasses").animate(...) it works, but why doesn't it work if I select just one element from the array?
I guess I maybe don't uderstand well the rules about objects or arrays.
That is because $(".myClasses") returns a jQuery object, and when you access it as an array it simply returns the DOM node and not a jQuery object. If you want to access them by index, simply use:
$(elements[1]), which converts the DOM node back into a jQuery object, so that you can apply jQuery methods to it, or
$(".myClasses").eq(1), which reduces a set of elements matched by the jQuery selector to a single element at the specified zero-based index. See documentation for .eq()
if you want to use a jquery function you have to cast a jquery object you do it like
$(elements[1]).animate(...
This question already has answers here:
Multiple selector chaining in jQuery?
(7 answers)
Closed 5 years ago.
I am trying to modify html's style when one of several classes is clicked on by .click() function, but I would like not to write one function for each class. Is there any way to put every class as selectors in the same function? And if there is, how would be the sintax?
Here is the piece of my code:
$(".back").click(function(){
console.log("widget closed");
if( !$("body").hasClass('widget-opened')){
$("html").css("overflow-y","auto");
}
});
In addition to .back, it would be nice to call two more classes (.laptop and .close)
Separate multiple selectors with a comma like below, to form a Multiple Selector
$(".back, .laptop, .close").click(function(){
simply use comma separated list:
$(".back, .laptop, .close").click(function(){
console.log("widget closed");
if( !$("body").hasClass('widget-opened')){
$("html").css("overflow-y","auto");
}
});
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
How to get a DOM Element from a JQuery Selector
I know using normal javascript i can do
formitem.validity.valid
or
formitem.checkValidity();
How do i use Jquery to call these functions?
Below im using a custom attribute selector to get my element but cant seem to use it like below...
$('[data-dependID=pobText]').validity.valid
or
$('[data-dependID=pobText]').formitem.checkValidity();
Simple but how do i do this?
You need to get DOM Node for that:
$('[data-dependID=pobText]').get(0).validity.valid;
$('[data-dependID=pobText]').get(0).formitem.checkValidity();
Use Get,
i.e.
$('[data-dependID=pobText]').get(0).formitem.checkValidity();
Use .get(n) to get the nth element as a DOM object, or just [n]
$('selector').get(n).foo
or
$('selector')[n].foo
jQuery calls to the DOM return an array-like object and so you can access the DOM elements in the "array" by an index. The get() method does the same thing, only that it encapsulates this in a function call (which is an overhead).
Better use the index instead:
$('[data-dependID=pobText]')[n].validity.valid;
$('[data-dependID=pobText]')[n].checkValidity();
This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
How to get a DOM Element from a JQuery Selector
I have a JavaScript library that takes one of parameters as
element: document.getElementById('file-uploader')
And it works well, though I try to use jQuery instead and error happens then.
element: $('#file-uploader')
I suppose these return different objects so how can I make it with jQuery but return an object of the same kind as if it were returned by getElementById method?
Try -
$('#file-uploader')[0] //or $('#file-uploader').get(0)
This will return the 'naked' JavaScript DOM object, the same as
document.getElementById('file-uploader')
would return. The example above will only return the first element of the matched set, but in a situation where you're searching by id that should be fine.
Try:
$('#file-uploader')[0]
It should be equiv to:
document.getElementById('file-uploader')
you have to use either [0] or .get(0) to return the dom object instead of the jquery:
$('#file-uploader')[0];
or
$('#file-uploader').get(0);