<script type="text/javascript">
alert(a);
</script>
Console log shows : "Uncaught ReferenceError: a is not defined";
<script type="text/javascript">
alert(a);
var a = 1;
</script>
at the middle of the browse, Log shows: "undefined"
How does this code run in js and what causes this difference
in this code
<script type="text/javascript">
alert(a);
var a = 1;
</script>
var a ; is hoisted to the top and it becomes
<script type="text/javascript">
var a;
alert(a);
a = 1;
</script>
so by the time a was alerted, it was undefined
In this code
<script type="text/javascript">
alert(a);
</script>
a was not defined at all, so it gave an error "Uncaught ReferenceError: a is not defined"
Related
I have the following script in my HTML, however I get a Question mark instead of the actual IP:
<script type="application/javascript">
var myButton = document.getElementById("clickButton");
var myText = document.getElementById("helloText");
myButton.addEventListener('click A', doSomething(), false);
function doSomething(json) {
myText.textContent = (json.ip);
}
function getIP(json) {
return json.ip;
}
</script>
<script type="application/javascript" src="https://api.ipify.org?format=jsonp&callback=getIP">
</script>
The problem is that doSomething doesn't receive the JSON as an argument. You need getIP to put the returned IP into a global variable, and then doSomething can display it.
var myButton = document.getElementById("clickButton");
var myText = document.getElementById("helloText");
myButton.addEventListener('click', doSomething, false);
function doSomething() {
myText.textContent = IP;
}
<script type="application/javascript">
var IP;
function getIP(json) {
IP = json.ip;
}
</script>
<script type="application/javascript" src="https://api.ipify.org?format=jsonp&callback=getIP">
</script>
<button id="clickButton">Show IP</button>
<div id="helloText"></div>
Also, the second argument to addEventListener should just be the function name, not a call to the function. And the first argument should just be the name of the event. There's no click A event, just click.
The function getIP() gets called when the //api.ipify.org script is loaded. Your getIP() function just returns the ip address. Other than that it does not do anything. Try doing something like this:
<div id="mydiv"></div>
<script>
var getIP = function(json) {
document.getElementById("mydiv").innerHTML = json.ip;
}
</script>
<script type="application/javascript" src="https://api.ipify.org?format=jsonp&callback=getIP">
</script>
Laravel how o can use javascript variables from include file? I try this below example but variable not found..
includeFile.blade.php
<script>
$(document).ready(function () {
var myMar = "Hello world";
});
</script>
default.blade.php
#include('layouts.includeFile')
<script>
$(document).ready(function () {
alert(myVar); //Here myVar is undefined
});
</script>
myVar must be declared outside the function to be visible in another functions
includeFile.blade.php
<script>
var myVar; // Create global variable
$(document).ready(function () {
myVar = "Hello world";
});
</script>
default.blade.php
#include('layouts.includeFile')
<script>
$(document).ready(function () {
alert(myVar);
});
</script>
It is because myMar is private in includeFile.blade.php. Try something like this
includeFile.blade.php
<script>
$(document).ready(function () {
var myMar = "Hello world";
#yield('doc_ready')
});
</script>
default.blade.php
#extends('includeFile')
#section('doc_ready')
alert(myVar); //Here myVar is defined
#stop
Or just remove var
<script>
$(document).ready(function () {
myMar = "Hello world";
});
</script>
And also you have typo in includeFile it is myMar and in default it is myVar
While working on IE10, I have found that the JavaScript functions which are registered or called from the code behind are throwing exception:
"JavaScript runtime error: 'function name' is undefined".
For ex:
Code behind in the (!IsPostBack) block:
Page.RegisterStartupScript("showGCAlert", "<script language=\"javascript\">ShowGCAlert();</script>");
PageView:
function ShowGCAlert()
{
alert('GCAlert');
if(document.getElementById('hdnGCAlert').value != "1")
{
document.getElementById('divGCAlert').style.display = "Block";
document.getElementById('chkReminder').focus();
document.getElementById('btnLogin').disabled = true;
document.getElementById('Button2').disabled = true;
}
else
{
document.getElementById('divGCAlert').style.display = "none";
document.getElementById('btnLogin').disabled = false;
document.getElementById('Button2').disabled = false;
if (document.getElementById("txtUsername").value != "")
document.getElementById("txtPassword").focus();
else
document.getElementById("txtUsername").focus();
}
}
When the page loads its throws the exception even though the ShowGCAlert() exists on the dynamic page.
After continuing the exception design page shows:
<script language="javascript" src="/ABC/DEF/Scripts/Common.js"></script>
<script language="javascript">
document.body.style.overflowY="hidden";
document.body.style.overflowX="hidden";
var jsAppName ='ABC';
</script>
<script language="javascript">
function window.onresize()
{
document.cookie = "resX="
+ document.body.clientWidth
+ ";resY="
+ document.body.clientHeight
+ ";path=/";
}
window.onresize();
</script>
<script type="javascript">
ShowGCAlert();
</script>
<script language="javascript">
document.getElementById('txtPassword').focus();
</script>
In ie9 or IE10 compatibility view its working fine. Please show me where i am doing wrong.
Try placing the script at the end of the page using RegisterClientScriptBlock and call it.
Page.ClientScript.RegisterClientScriptBlock("showGCAlert",
"<script type=\"text/javascript\">ShowGCAlert();</script>");
I have a webpage where I load some javascript files in header. Some subpage will load aditional javascript files. On the main page everything is working just fine but on the subpage I get alot of exceptions like this :
Uncaught TypeError: Property '$' of object [object Object] is not a
function
I can see that this exception occurs in details.js, voteHandler.js and 4 times in the HTML page itself. The exception is always thrown on this line :
$("document").ready(function () {
This is how the main page that works looks like :
<head>
<script type="text/javascript" src=/Scripts/jquery-1.7.1.min.js></script>
<script type="text/javascript">
//URL for voting
var _postVoteUrl = 'http://localhost:5215/Post/Vote'
//URL for tags
var _tagsUrl = 'http://localhost:5215/Post/Tags'
//Keep track of if a cascading is loading, if so, cancel submits
var cascadingControlLoading = false;
window.latestClick = '';
function IsNotDblClick(objectID) {
if (window.latestClick != objectID &&
!cascadingControlLoading) {
window.latestClick = objectID;
return true;
} else {
return false;
}
}
$(document).ready(function () {
if($('#rightCon').text().trim().length < 1)
{$('#rightCon').hide();}
});
</script>
<script type="text/javascript" src=/Scripts/jquery-ui-1.8.20.min.js>"></script>
<script type="text/javascript" src=/Scripts/jquery.elastic.source.js></script>
<script type="text/javascript" src=/Scripts/jquery.validate.min.js></script>
<script type="text/javascript" src=/Scripts/jquery.validate.unobtrusive.min.js></script>
<script type="text/javascript" src=/Scripts/jquery.qtip.min.js></script>
<script type="text/javascript" src=/Scripts/formhandler.js></script>
<script type="text/javascript" src=/Scripts/taghandler.js></script>
<script src="/Scripts/voteHandler.js"></script>
<script type="text/javascript" src=/Scripts/select2.min.js %>"></script>
<script>
function TogglePostCon() {
$('#postListEditorCon').toggle();
}
SetupTagTextBox("txtTagBox", false);
SetupTagTextBoxPersonalTag("txtPersonalTagBox", true);
SetupTagTextBoxPersonalTag("txtPersonalIgnoreTagBox", true);
</script>
<script src="/Scripts/modernizr-2.5.3.js"></script>
</head>
And this is the subpage that throws the exceptions :
<head>
<script type="text/javascript" src=/Scripts/jquery-1.7.1.min.js></script>
<script type="text/javascript">
//URL for voting
var _postVoteUrl = 'http://localhost:5215/Post/Vote'
//URL for tags
var _tagsUrl = 'http://localhost:5215/Post/Tags'
//Keep track of if a cascading is loading, if so, cancel submits
var cascadingControlLoading = false;
window.latestClick = '';
function IsNotDblClick(objectID) {
if (window.latestClick != objectID &&
!cascadingControlLoading) {
window.latestClick = objectID;
return true;
} else {
return false;
}
}
$(document).ready(function () {
if($('#rightCon').text().trim().length < 1)
{$('#rightCon').hide();}
});
</script>
<script type="text/javascript" src=/Scripts/jquery-ui-1.8.20.min.js>"></script>
<script type="text/javascript" src=/Scripts/jquery.elastic.source.js></script>
<script type="text/javascript" src=/Scripts/jquery.validate.min.js></script>
<script type="text/javascript" src=/Scripts/jquery.validate.unobtrusive.min.js></script>
<script type="text/javascript" src=/Scripts/jquery.qtip.min.js></script>
<script type="text/javascript" src=/Scripts/formhandler.js></script>
<script type="text/javascript" src=/Scripts/taghandler.js></script>
<script src="/Scripts/details.js"></script>
<script src="/Scripts/voteHandler.js"></script>
<script>
$(function () {
//Google +1
$.getScript("http://apis.google.com/js/plusone.js", null, true);
//Twitter
$.getScript("http://platform.twitter.com/widgets.js", null, true);
//Facebook
$.getScript("http://connect.facebook.net/en_US/all.js#xfbml=1", function () {
$('body').append('<div id="fb-root"></div>');
FB.init({ status: true, cookie: true, xfbml: true });
}, true);
});
</script>
<script src="/Scripts/modernizr-2.5.3.js"></script>
</head>
I hade some of the scripts loaded at the bottom of the body before and this did not generate the exception but from what I read this is not a recomended way to go.
So why is my subpage generating these exceptions?
In "no-confict" mode, the $ shortcut is not available and the longer jQuery is used, i.e.
jQuery(document).ready(function ($) {
By including the $ in parenthesis after the function call you can then use this shortcut within the code block.
Replace your code
$(document).ready(function () {
if($('#rightCon').text().trim().length < 1)
{$('#rightCon').hide();}
});
with this
jQuery(document).ready(function ($) {
if($('#rightCon').text().trim().length < 1)
{$('#rightCon').hide();}
});
Why ReferenceError: $ is not defined ?
<script src="LAB.js"></script>
<script>
$LAB.script("jquery/jquery.js")
</script>
</body>
<p><?php echo mt_rand(89,161464) ?></p>
<script>
//Uncaught ReferenceError: $ is not defined
$(document).ready(function(){
console.log('reddy');
$("p").css('color','red');
})
</script>
But work:
window.onload=function(){
$("p").css('color','red');
}
2.item1.js
var interface={name:'interface'};
item2.js
interface.hu={name:'int'};
$LAB.script("item2.js").wait();
$LAB.script("item1.js");
//Uncaught ReferenceError: interface is not defined
Help
try :
$LAB.script("jquery/jquery.js").wait(function () {
if( window.jQuery ) { //is jquery loaded
$("p").css('color','red');
}
});
OR
$LAB.script("jquery/jquery.js").wait(function () {
$(document).ready(function() {
$("p").css('color','red');
}
});
See more:: LABjs Doc