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/
Related
This question already has answers here:
Use JavaScript to find a specific link
(4 answers)
Closed 3 years ago.
Before I add a link to a page, I want to check if it already exists anywhere on the page first.
I thought I could do :-
if (document.innerHTML.indexOf(link) != -1) {
But I get "Cannot read property 'indexOf' of undefined"
I wonder if there is a way to check if a link already exists on the page. I would prefer Javascript code as opposed to JQuery please.
Your help, much appreciated.
document.body.textContent.search("link")
Use body.textContent instead of innerHTML
If you get -1 as result then it means it does not exists else it will probably give you the position of the match.
Refer : https://www.w3schools.com/jsref/jsref_search.asp
and https://www.w3schools.com/jsref/prop_node_textcontent.asp
This question already has answers here:
What does $(function() {} ); do?
(6 answers)
Closed 4 years ago.
Why is this simple global variable not working inside a function
var test_1 = "None";
$(function(){
console.log(test_1)
})
I am getting the result Undefined
Check, whether you have jquery or not. I have created a jsfiddle (https://jsfiddle.net/2kudvsr0/) for your code and its printing None (desired output).
Just make sure you are executing your code once jQuery is imported successfully.
This question already has answers here:
What does "this" refer to in arrow functions in ES6?
(10 answers)
Closed 4 years ago.
I'm trying to get the height of my elements that contains class category. I wan't to use .each() function but it seems to return me the entire document. There's my code :
$('.category').each((index) => {
console.log($(this).height());
});
This return me :
828 (the document height)..
Any idea ?
That's because you are using an Arrow Function, which binds the this value of the enclosing context.
Use a regular Function.
$('.category').each(function(index) {
console.log($(this).height());
});
I know they look cute and all that but they are not perfect replacements for regular Functions.
This question already has answers here:
Check if element exists in jQuery [duplicate]
(8 answers)
Closed 6 years ago.
Let's say we have:
var $letsTestA = $( '.lets-test-a' ),
$letsTestB = $( '.lets-test-b' );
While the HTML is:
<div class="lets-test-a"></div>
(I know, I left out .lets-test-b)
Now, what happens if we try to call the variable $letsTestB?
I did do some testing, I'm not just blindly asking a question without doing some research first, but I'm a little confused with how this seems to work...
If I alert($letsTestA); or alert($letsTestB); I get the same outcome which is just [object Object] when testing from JSFiddle?
Here's my test fiddle: https://jsfiddle.net/m6j03423/
Furthermore to this, what I'm actually trying to do here is create a way to find out whether the content of a variable exists or not.
In PHP I would just write if (empty($myVar)) { // do action } but JS doesn't work the same way.
In JS I think I can write if ($letsTestA) { } and it should be able to print the result of the variable? But, I'm still getting [object Object].
What am I missing?
Can I even print the contents of a jQuery object?
How can I test whether the variable contains the true value of a jQuery object?
EDIT:
Admittedly, I did see a few different answers saying to check the length, but I didn't understand that enough to connect that to what I'm doing.
You can use the .length property of the object to ascertain whether elements exists or not
if ($letsTestA.length > 0) {
//element exists
}
var $letsTestA = $('.lets-test-a'),
$letsTestB = $('.lets-test-b');
console.log($letsTestA.length);
console.log($letsTestB.length);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="lets-test-a"></div>
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).