Function getLocation is working when started with button but doesn’t work when putted in "$(document).ready… Why?
Here’s the Codepen: CLICK!
Function getLocation is working when started with button but doesn’t work when putted in "$(document).ready… Why?
Here’s the Codepen: CLICK!
You need to use the browser console (not codepen’s console, but the browser console). It’s usually opened with something like ctrl-shft-j
. In there you will see an error:
Uncaught ReferenceError: $ is not defined at pen.js:114:100:
Since “$” is jQuery, that is saying that jQuery has not been loaded. Your code never gets past $(document).ready
because it doesn’t know what it is and crashes.
In codepen, you load jQuery at settings/javascript/quick-add.
OMG, shame on me How could i forgot about this?
It happens. Trust me, it happens.
But I would recommend learning to use the browser console. That is the most valuable debugging tool you can use. And what I did here is only like 2% of it’s abilities. Whenever code doesn’t do what I expect, the browser console is the first place I check. I often have it open while I code, sending console.log
statements there to check on things.
If I may ask you something again (Yes i was looking onto debugging tool - it is great, i downloaded a special developer edition of one browser). I have a problem with my function called showPosition. She’s very messed up, but i want to make it work and then pratice with cleaning the code. Could you take a look onto my code? HERE. I want to show the temperature and C letter should appear after temperature, then if someone’s click C letter it will change to F, almost the same like example : EXAMPLE .
Well, with a little monkeying, it works. The problem right now is that you never call the code to put the temp and unit on the screen. It’s inside a click handler for clicking on the units. You’ve got a chicken and egg thing - how can they click on the units to write the units if there is no units to click.
So you need to call that code at some point. I would wrap that code:
var currentUnit = $("#unit").text();
var newTempUnit = currentUnit == "C" ? "F" : "C";
$('#unit').text(newTempUnit);
if(newTempUnit == 'F'){
$('#temp').html(data.current.temp_f);
}
else {
$('#temp').text(data.current.temp_c);
}
in a function. I would call that function when you first start (inside the getJSON
) and then again inside the click handler. You could write out all the code in both places, but that is bad practice. Better to wrap it in a function that gets called. Let us know if that doesn’t make sense.