Uncaught ReferenceError: sendcard is not defined
Question
Ok so i keep getting this error but have no idea why... And yes i have checked other similar posts but nothing helped. Here is the error:
Uncaught ReferenceError: sendcard is not defined
onclick @ kikcards.html:102
which is:
<tr><td colspan=2 align=center><img src="/Images/generate.png" width=150 onclick="sendcard()"></td></tr>
All the code i have:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Kik Cards | Crazii</title>
<link rel="stylesheet" type="text/css" href="/-default.css"/>
<link href='https://fonts.googleapis.com/css?family=Permanent+Marker' rel='stylesheet' type='text/css'>
<meta charset = "utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<link id="kikicon" rel="kik-icon" href="kik.png"/>
<script src="/navOpen.js"></script>
<script src="https://cdn.kik.com/kik/2.0.5/kik.js"></script>
</head>
<body class="body">
<nav id="mainNav">
<div id="logo">
<a href="/index.html"><span>C</span>razii<span> </span> </a>
</div>
<div id="mobileToggle">
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
</div>
<ul id="mainMenu">
<li>
<a href="/index.html">Home</a>
</li>
<li>
<a href="/about.html">About</a>
</li>
<li>
<a href="#">PS3 Modding</a>
</li>
<li>
<a href="/ebooks/ebooks.html">PDFs</a>
</li>
<li>
<a href="/kikcards.html">Kik Cards</a>
</li>
</ul>
</nav>
<div class="mainContent">
<div class="content">
<article class="Content1">
<header>
<h2><a href="#" title="1st Post"> Kik Cards</a></h2>
</header>
<footer>
<p class="post-info"> <br> </p>
</footer>
<content>
<p>
<table>
<tr><td style="text-align:right">Title:</td><td><input id="title"></td></tr>
<tr><td style="text-align:right">Text (optional):</td><td><input id="text"></td></tr>
<tr><td style="text-align:right">Main Title:</td><td><input id="maintitle"></td></tr>
<tr><td style="text-align:right">Little Icon (URL, optional):</td><td><input id="icon"></td></tr>
<tr><td style="text-align:right">Big Picture (URL, optional):</td><td><input id="pic">(If nothing is entered here, the default icon will be used)</td></tr>
<tr><td style="text-align:right">Redirect URL (optional):</td><td><input id="redirect"></td></tr>
<tr><td style="text-align:right">Big picture? (hides the title)</td><td><input type="checkbox" id="big"></td></tr> <!-- document.getElementById(big).checked -> bool -->
<tr><td style="text-align:right">Forward-able?</td><td><input type="checkbox" id="forward" checked=true></td></tr>
<tr><td colspan=2 align=center><img src="/Images/generate.png" width=150 onclick="sendcard()"></td></tr>
</table>
</p>
</content>
</article>
</div>
</div>
<footer class="mainFooter">
<p> Copyright © 2015 <a href="#" title="Crazii"><b>Crazii</b></p>
</footer>
<script>
window.onload = function()
{
if (kik.message && kik.message['url']!="") {
window.location.replace(kik.message['url']);
}
var title = "";
var maintitle = "";
var body = "";
var display = "";
var bigpicture = "";
var forwardable = "";
var redirect = "";
function precede(str, check_for) {
return str.slice(0, check_for.length) == check_for;
}
function sendcard() {
title = document.getElementById("title").value;
maintitle = document.getElementById("maintitle").value;
if (maintitle=="") {
maintitle = "Kik Cards | Crazii";
}
body = document.getElementById("text").value;
document.getElementById("kikicon").href = document.getElementById("icon").value;
display = document.getElementById("pic").value;
if (display == "") {
display = "http://crazii.herobo.com/Images/kik.png";
}
bigpicture = document.getElementById("big").checked;
if (document.getElementById("forward").checked == true) {
forwardable = false;
} else {
forwardable = true;
}
redirect = document.getElementById("redirect").value;
if (precede(redirect, "http://")) {
redirect = redirect;
} else if (precede(redirect, "https://")) {
redirect = redirect;
} else if (redirect == "") {
redirect = "http://crazii.herobo.com";
} else {
redirect = "http://"+redirect;
}
document.getElementById("webtitle").innerHTML = maintitle;
kik.send({
title: title,
text: body,
pic: display,
big: bigpicture,
noForward: forwardable,
data: {'url': redirect}
});
}
}
</script>
</body>
</html>
In advance i appreciate any help i can get, thanks!
2 answers
solution1
0 ACCPTED 2015-10-19 07:23:18
The function sendcard() is defined within the scope of the window.onload callback, as of that it is not visible in the global scope.
To self this you cab use addEventListener .
You need the be able to find your element, eg by adding an id to it:
<img src="/Images/generate.png" width=150 id="sendcard">
Then in your window.onload you search for that element, and add an event listener:
document.getElementById("sendcard").addEventListener("click",sendcard, false);
You could also think of moving the sendcard definition out of the callback, but then you would pollute the global scope which should be avoided.
solution2
0 2015-10-19 07:48:56
Try this:-
<!DOCTYPE html>
<html lang="en">
<head>
<title>Kik Cards | Crazii</title>
<link rel="stylesheet" type="text/css" href="/-default.css"/>
<link href='https://fonts.googleapis.com/css?family=Permanent+Marker' rel='stylesheet' type='text/css'>
<meta charset = "utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<link id="kikicon" rel="kik-icon" href="kik.png"/>
<script src="/navOpen.js"></script>
<script src="https://cdn.kik.com/kik/2.0.5/kik.js"></script>
</head>
<body class="body">
<nav id="mainNav">
<div id="logo">
<a href="/index.html"><span>C</span>razii<span> </span> </a>
</div>
<div id="mobileToggle">
<div class="bar"></div>
<div class="bar"></div>
<div class="bar"></div>
</div>
<ul id="mainMenu">
<li>
<a href="/index.html">Home</a>
</li>
<li>
<a href="/about.html">About</a>
</li>
<li>
<a href="#">PS3 Modding</a>
</li>
<li>
<a href="/ebooks/ebooks.html">PDFs</a>
</li>
<li>
<a href="/kikcards.html">Kik Cards</a>
</li>
</ul>
</nav>
<div class="mainContent">
<div class="content">
<article class="Content1">
<header>
<h2><a href="#" title="1st Post"> Kik Cards</a></h2>
</header>
<footer>
<p class="post-info"> <br> </p>
</footer>
<content>
<p>
<table>
<tr><td style="text-align:right">Title:</td><td><input id="title"></td></tr>
<tr><td style="text-align:right">Text (optional):</td><td><input id="text"></td></tr>
<tr><td style="text-align:right">Main Title:</td><td><input id="maintitle"></td></tr>
<tr><td style="text-align:right">Little Icon (URL, optional):</td><td><input id="icon"></td></tr>
<tr><td style="text-align:right">Big Picture (URL, optional):</td><td><input id="pic">(If nothing is entered here, the default icon will be used)</td></tr>
<tr><td style="text-align:right">Redirect URL (optional):</td><td><input id="redirect"></td></tr>
<tr><td style="text-align:right">Big picture? (hides the title)</td><td><input type="checkbox" id="big"></td></tr> <!-- document.getElementById(big).checked -> bool -->
<tr><td style="text-align:right">Forward-able?</td><td><input type="checkbox" id="forward" checked=true></td></tr>
<tr><td colspan=2 align=center><img src="imgh.jpg" width=150 onclick="sendcard()" /></td></tr>
</table>
</p>
</content>
</article>
</div>
</div>
<footer class="mainFooter">
<p> Copyright © 2015 <a href="#" title="Crazii"><b>Crazii</b></p>
</footer>
<script>
if (kik.message && kik.message['url']!="") {
window.location.replace(kik.message['url']);
}
var title = "";
var maintitle = "";
var body = "";
var display = "";
var bigpicture = "";
var forwardable = "";
var redirect = "";
function precede(str, check_for) {
return str.slice(0, check_for.length) == check_for;
}
function sendcard() {
alert("sdf");
title = document.getElementById("title").value;
maintitle = document.getElementById("maintitle").value;
if (maintitle=="") {
maintitle = "Kik Cards | Crazii";
}
body = document.getElementById("text").value;
document.getElementById("kikicon").href = document.getElementById("icon").value;
display = document.getElementById("pic").value;
if (display == "") {
display = "http://crazii.herobo.com/Images/kik.png";
}
bigpicture = document.getElementById("big").checked;
if (document.getElementById("forward").checked == true) {
forwardable = false;
} else {
forwardable = true;
}
redirect = document.getElementById("redirect").value;
if (precede(redirect, "http://")) {
redirect = redirect;
} else if (precede(redirect, "https://")) {
redirect = redirect;
} else if (redirect == "") {
redirect = "http://crazii.herobo.com";
} else {
redirect = "http://"+redirect;
}
document.getElementById("webtitle").innerHTML = maintitle;
kik.send({
title: title,
text: body,
pic: display,
big: bigpicture,
noForward: forwardable,
data: {'url': redirect}
});
}
</script>
</body>
</html>
Remove :- window.onload = function() { and end image tag
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.
Related Question
Uncaught ReferenceError: Dygraph is not defined
Uncaught ReferenceError: model is not defined
Uncaught ReferenceError: getStr is not defined
Uncaught ReferenceError: rgba is not defined
Uncaught ReferenceError: Activetab is not defined
Uncaught ReferenceError: xyz is not defined
Uncaught referenceError google is not defined
HAML Uncaught ReferenceError: $ is not defined
Uncaught ReferenceError: findWeather is not defined
Uncaught ReferenceError: GBrowserIsCompatible is not defined
Related Tags