|
JavaScript - Function Not Defined! But It Is! :-) Help
Ok, I have an event handler for a click - ala:
using prototype and here is a snippet. Code: spotL = some_length_of_an_array;
$R(1,spotL).each(function(n) {
$('spot_btn_' + n).style.display = 'block';
$('spot_btn_' + n).observe("click", function(){countdwn_clear();} );
});
Now, that code above fires off AFTER I call an init function that just runs thru some things... But not only that, that function "countdwn_clear()" loads before I call the code above... so its there. Now, the "element" I am trying to attach that event handler in an anchor tag in a UL element ala. Code: <ul id="buttons" style="display: none;">
<li id="spot_btn_1" class="selected"><a href="javascript://" id="btn1">1</a></li>
<li id="spot_btn_2"><a href="javascript://" id="btn2">2</a></li>
</ul>
so, I originally thought it that I was trying to attach an event handler to an element in another that had a display of none -- so I switched it to block and I'd still get this error: countdwn_clear is not defined NOW -- if put this right below the function call, ala: Code: function countdwn_clear(){d_some_code_here}
$$("#buttons li")[0].observe("click", function(){countdwn_clear();} );
$$("#buttons li")[1].observe("click", function(){countdwn_clear();} );
^^^^ that works! why?
In one case, i am calling it right below the function and I am using a different reference: $$("#buttons li")[1] in the code where I "build" it, I have: $('spot_btn_' + n).observe("click", function(){countdwn_clear();} ); ???? could it be the event is on the "li" instead of the "a" or ? I don't get it. Any ideas? Similar TutorialsHi, I am facing a problem in passing replace() function as an argument in user defined java function, can any one help me how to resolve it? intention is to pass a file path to my user defined function, but before passing the path i want to replace the character '\' to '\\' I am posting my javascript function he <a href="#" onclick="OpenDocPreview('<%# Eval("PATH")%>'.replace(/\\/g,"\\\\"), '<%# Eval("Filename")%>')"><%# Eval("DocTitle") %></a> function OpenDocPreview(url, docname) { alert('message from search base : ' + url + ' ' + docname); } thank you, i keep getting error Call to undefined function codeandurl() below is my code PHP Code: <?php $value= strip_tags(get_field('link',$post)); $resultid=get_field('resultid',$post); codeandurl($resultid,$value); ?> <div id="result"></div> <script type="text/javascript"> function codeandurl(resultid,url){ $( "#result" ).text(resultid); $( "#result" ).dialog({ modal: true, buttons: { Ok: function() { $( this ).dialog( "close" ); } } }); window.open(url); return false; } </script> Hi guys my site is not working fireug says that the function 'changevalu()' ia not defined but it is heres my site Code: <!doctype html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html" >
<title>
portl - beta 0.1
</title>
<meta name="description" content="portl Is a file transfer system. ">
<meta name="author" content="Techyonomics">
<meta name="viewport" content="width=device-width">
<meta name="keywords" content="portl,techyonomics,school,free,privet,trans,files,ui,cool" >
<link rel="stylesheet" href="style.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="javascript/text">
function changevalu() {
var valueofpress = $(this).text();
var passval = $(#password).val();
$(#password).val(passval + valueofpress);
alert(passval + valueofpress);
}
</script>
</head>
<body>
<header>
</header>
<div role="main">
<div id="keypad">
<div id="keys">
<div class="key" onmouseup="javascript:changevalu()">1</div>
<div class="key">2</div>
<div class="key">3</div>
</br>
</br>
</br>
<div class="key">4</div>
<div class="key">5</div>
<div class="key">6</div>
</br>
</br>
</br>
<div class="key">7</div>
<div class="key">8</div>
<div class="key">9</div>
</br>
</br>
</br>
<div class="key">C</div>
<div class="key">0</div>
<div class="key">E</div>
</div>
<form id="hiddenform" action="login.php" method="post">
<input id="password" type="text" value="" name="pass"></form>
</div>
</div>
<footer>
</footer>
</body>
</html>
Here is my function: Code: function mod_selection(val1,val2) {
if( -1 != navigator.userAgent.indexOf ("MSIE") ) {
var range = document.selection.createRange();
var stored_range = range.duplicate();
if(stored_range.length > 0) {
stored_range.moveToElementText(textArea);
stored_range.setEndPoint('EndToEnd', range);
textArea.selectionStart = stored_range.text.length - range.text.length;
textArea.selectionEnd = textArea.selectionStart + range.text.length;
}
alert('hi');
// Get the text area
var textArea = $("#text_edit");
textArea.hover(function() {alert('hi');})
// Do we even have a selection?
if (typeof(textArea.selectionStart) != "undefined") {
// Split the text in three pieces - the selection, and what comes before and after.
var begin = textArea.value.substr(0, textArea.selectionStart);
var selection = textArea.value.substr(textArea.selectionStart, textArea.selectionEnd - textArea.selectionStart);
var end = textArea.value.substr(textArea.selectionEnd);
// Insert the tags between the three pieces of text.
textArea.value = begin + val1 + selection + val2 + end;
}
}
}
Basically what it does is insert BBCode tags for whatever text you have highlighted. Here is my HTML for it: Code: <div class="two-row">
<label>Content: </label>
<a href="#" onclick="mod_selection('','');return false;">B</a>
<input type="button" value="I" onclick="mod_selection('','')" />
<input type="button" value="U" onclick="mod_selection('','')" /><br />
<textarea id="text_edit" name="body" rows="25" cols="51"><?php if(isset($_POST['submit']) || isset($_POST['preview'])) { echo $_POST['body']; }else { echo $news_body; } ?></textarea>
</div>
It says the mod_selection is not defined. I'm doing alert('hi'); for testing purposes and it won't print hi.. sooooo I feel like I need a second pair of eyes. I want it to at least recognize the function before I debug it any further. JavaScript: Code: function test() {
alert('dsd');
}
HTML: Code: <a href="#" onClick="test()">Test Link</a> JS Error: Code: Error ``ReferenceError: test is not defined'' [x-] in file ``file:///C:/Users/Martyn%20Ball/Desktop/test.php#'', line 1, character 0. Okay wtf. In jquery-1.4.2.js I find the following - - - hide: function( speed, callback ) { ... } - - - Where is this syntax defined? ... and is it semantically different than - - - function hide( speed, callback ) { ... } - - - I have a good understanding of javascript although I am new to working xml. So I am having a problem getting javascript to recognize that my parameter value in my function call is an attribute in my xml. I called the js function like this: Code: <a href="#" onClick="ebookCategory(marketing);">Marketing</a> Here is my js function: Code: var category;
function ebookCategory(category) {
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET","ebook.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
document.write("<table border='1'>");
var x=xmlDoc.getElementsByTagName(category);
for (i=0;i<x.length;i++)
{
document.write("<tr><td>");
document.write(x[i].getElementsByTagName("bookCover")[0].childNodes[0].nodeValue);
document.write(x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue);
document.write(x[i].getElementsByTagName("description")[0].childNodes[0].nodeValue);
document.write(x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue);
document.write("</td><td>");
i++;
document.write(x[i].getElementsByTagName("bookCover")[0].childNodes[0].nodeValue);
document.write(x[i].getElementsByTagName("title")[0].childNodes[0].nodeValue);
document.write(x[i].getElementsByTagName("description")[0].childNodes[0].nodeValue);
document.write(x[i].getElementsByTagName("price")[0].childNodes[0].nodeValue);
document.write("</td></tr>");
}
document.write("</table>");
} // end ebookCategory()
Some of the aspects in this function are new to me, xml stuff. Here is my xml setup: Code: <ebook category="marketing"> <bookCover><img src="/millionaire/ebooks/covers/miracle2.jpg" height="150" width="150" /></bookCover> <title>Marketing Miracle</title> </ebook> I appreciate any help in the matter I've been working on a web-site and I've run into a problem. None of the buttons I've created will access the functions that they're supposed to access. When I used the JavaScript console in Chrome it threw the error Uncaught ReferenceError: (function) is not defined I've looked over it for syntax errors, but I couldn't find any. Am I missing anything? Here's my unfinished code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>N Physics</title>
<script type="text/javascript">
var numforms = 0;
var curentform = 0;
//consider further editing
function reset() {
window.location.reload();
}
function addvar() {
currentform = numforms + 1;
selectscreen();
}
function changevar() {
}
function selectscreen() {
selectdiv = document.createElement('div');
selectdiv.id = "select";
tkdklskjksdkfj
variable = document.createElement('SELECT');
variable.setAttribute('Name', 'variable');
variable.id = "variable";
ForceReg = document.createElement('option');
ForceReg.value = '001';
ForceReg.appendChild(document.createTextNode('Force'));
variable.appendChild(ForceReg);
Mass = document.createElement('option');
Mass.value = '002';
Mass.appendChild(document.createTextNode('Mass'));
variable.appendChild(Mass);
Accelleration = document.createElement('option');
Accelleration.value = '003';
Accelleration.appendChild(document.createTextNode('Accelleration'));
variable.appendChild(Accelleration);
selectdiv.appendChild(variable);
document.body.appendChild(selectdiv);
}
function newform() {
}
function cancel() {
}
function deleteform() {
}
fucntion checkprimary() {
}
function findeq() {
}
</script>
<style type="text/css">
<!--
body {
background-color:#999999;
}
#LayerHead {
position:absolute;
left:0px;
top:0px;
width:100%;
height:50px;
z-index:1;
background-color: #000000;
}
.spacer {
height:51px;
z-index:0;
}
.Button {
height:50px;
z-index:2;
}
.style1 {
color: #FFFFFF;
font-size: 43px;
z-index:1;
}
.style2 {
color: #FFFFFF;
font-size: 10px;
z-index:3;
}
#LeftButton {
width: 49%;
height: 50px;
left: 0px;
z-index:2;
}
#RightButton {
width: 49%;
height: 50px;
right: 0px;
z-index:2;
}
#Bottom {
position:fixed;
background-color:#000000;
width:100%;
bottom: 0px;
left: 0px;
z-index:3;
}
#select {
position: fixed;
width: 100%;
height: 100%;
opacity: 0.7;
filter: aplha(opacity=40);
background-color:#333333;
}
#variable {
position: fixed;
top: 50%;
width: 90%;
margin-left: auto;
margin-right: auto;
}
-->
</style>
</head>
<body>
<div id="LayerHead">
<span class="style1">N Physics</span>
</div>
<div class="spacer"></div>
<div class="Button">
<input type="button" id="LeftButton" value="Instructions" onclick="location.href = 'instructions.html'" />
<input type="button" id="RightButton" value="Reset" onclick="reset();" />
</div>
<div id="VarDone"></div>
<div class="Button">
<input type="button" id="LeftButton" value="Add a New Variable" onclick="addvar();" />
<input type="button" id="RightButton" value="Find the Equation" onclick="findeq();" />
</div>
<div id="Answer"></div>
<div id="Bottom">
</div>
</body>
</html>
This is an admittedly convoluted script, so I'm not surprised it's a bit buggy. Basically, I'm arranging several hundred small divs on a page. This code writes each of them onload , and checks urlArray to see if the specific div being written has a function attached to it, then enables onmouseover / onmouseout hand pointer/default pointers to it, and, of course, runs the function onclick . Code: var urlArray = ["main", "none", "none", "none", ... (snip) ]
var i = 0;
function writeDivs(){
document.write("<link href='css/css1.css' rel='stylesheet' type='text/css' />")
while (i<=447){
document.write("<div class='posDiv' id='div"+i+"' onclick='javascript:if(\""+urlArray[i]+"\" != \"none\"){window["+urlArray[i]+"()]}' onmouseover='javascript:if(\""+urlArray[i]+"\" != \"none\"){this.style.cursor=\"pointer\"}' onmouseout='if(\""+urlArray[i]+"\" != \"none\"){this.style.cursor=\"default\"}'>"+textArray[i]+"</div>");
i++;
}
}
The script as it appears here runs great in chrome, but Firefox tells me that "main" is undefined whenever I click or roll over the div, and IE says "object expected" when I click. "main" is the name of a function defined in an external js file (though pasting the function into the main document doesn't do anything). In fact, the whole of the above script may not even be relevant, since the following doesn't work either: Code: document.write("<div class='posDiv' id='div"+i+"' onclick='javascript:main()' >"+textArray[i]+"</div>");
I need a fresh set of eyes on this. Any volunteers? ~gyz Hi, Using a while loop in a function, I am trying to test an input character against a stored string of characters. I want the function to return the input character only if it is not in the stored string of characters. The code I've prepared is as follows: Code: <SCRIPT language = "JavaScript">
var storedLetters = 'sideways';
function requestLetters(aString)
{
var validLetter ='';
var inputLetter = window.prompt('Please input a single lower-case letter', '');
while (storedLetters.indexOf(inputLetter) != -1)
{
inputLetter = window.prompt('You have already tried ' + inputLetter + ' . Please try another' + ' letter.');
}
validLetter = inputLetter;
return validLetter;
}
requestLetters(storedLetters);
document.write(validLetter);
</SCRIPT>
The code works fine if I remove it from the function wrapper but if the function is called I keep getting an error message that the variable validLetter is not defined. Can anyone see why this is the case? Thanks. Hi, I have a button that when you click it displays the results of my db in a div. What I am trying to do is to get the results to update every five seconds. I thought setTimeout was the best way to achieve this. However I am getting the error message that ID is not defined on the setTimeout line. I thought it would automatically input ID into the fields marked ID when the onloadXMLDocRefresh('File.php','txtHint') button is clicked? The button works to load the script, but the refreshing the div is not. My script is: Code: <script type="text/javascript">
function loadXMLDocRefresh(File,ID){
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
}
else {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById(ID).innerHTML=xmlhttp.responseText;
timer = setTimeout('loadXMLDocRefresh(File,ID)',5000);
}
}
xmlhttp.open("POST",File,true);
xmlhttp.send();
}
</script>
I am trying to use a user defined function and text area for a project, but nothing is showing up in the text area when i click the button. Code: <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function Greet()
// Assumes: firstNameBox and companyName contain names
// Results: writes a message with those names in messageArea
{
firstName = document.getElementById("firstNameBox").value;
companyName = document.getElementById("companyNameBox").value;
message = "To whom it may concern, my name is " + firstName + ", I am very interested in the job opening at, " + compnayName +
". I feel that I would greatly contribute to " + companyName +
" success. I feel I fit the requirements needed to become an employee at " + companyName +
". I look forward to hearing from you.";
document.getElementById("messageArea").value = message;
}
</script>
</head>
<body>
<p>
Enter your first name: <input type="text" id="firstNameBox" size="15" />
<br />
Enter the Company name: <input type="text" id="companyNameBox" size="15" />
</p>
<p>
<input type="button" value="Click for Greeting" onclick="Greet();" />
</p>
<p>
<textarea id="messageArea" rows="4" cols="40"></textarea>
</p>
</body>
Hi, I'm trying to call a Js function from a test.js located in a HTML file. I'm getting error message "Object has no method..." in Chrome. But no issues are seen in Firefox. Can any one please let me know how i can fix this. <html> <head> .... .... .... <div> <html> <head> <script src="test.js"></script> <script> function aFunc() { alert ("Inside aFunc"); } </script> </head> <body> </html> .... .... .... </div> </head> </html> test.js function bFunc () { aFunc (); } Hi, I have the below function and I keep getting the error Lid is not defined. Code: <script type="text/javascript">
function loadTips(file,ID,File,id){
alert(file);
alert(ID);
alert(File);
alert(id);
loadXMLDoc(file,ID);
var l=setTimeout("loadXMLDocRefresh(File,id)",10000);
}
</script>
My trigger button is: <input type="button" class="button3" value="Tips" onclick="loadTips('getTees.php','txtHintTees','getLees.php','txtHintLees')" /> So my alert Lid comes up with txtHintLees, so it is working up until the alert. Which leads me to believe that maybe it doesn't like being wrapped in "", without "" though firebug halts the process. I tried wrapping it in {} e.g. {loadXMLDocRefresh(File,id)} but that wasn't liked either. I'll stop my list of things I tried that don't work now. But does anyone have any ideas? Hey everyone, I wanted to write my own script for a fade-in animation, since the ones I have found have got too many options or need some framework, which makes them unnecessarily big. I wanted to learn too. Unfortunately, the code didn't work as I wanted, and I commented some things so as to find out what's happening. The only function called from outside is fadeIn with a string as argument (in the example, this string is: d1296668690535). This is the code: Code: var fadems = 500; // Anim. duration in milliseconds
var fps = 20; // Frames per second
function fadeIn(elemId){
var frames = fadems/1000 * fps;
var delay = 1000 / fps;
var incrOp = 1 / frames;
//document.getElementById(elemId).style.zoom = '1';
setOp(elemId, 0);
for(i=1; i<=frames; i++){
debugOutLn("(fadeIn for) elemId = " + elemId);
setTimeout("setOp(" + elemId + "," + incrOp*i + ")", delay*i);
}
}
function setOp(elemId, val){
debugOutLn("(setOp) elemId = " + elemId + "; val = " + val);
// document.getElementById(elemId).style.opacity = val;
// document.getElementById(elemId).style.filter = 'alpha(opacity = ' + val * 100 + ')';
}
Code: function debugOutLn(str){
document.getElementById("debug").innerHTML += str + "<br />";
}
And this is the text it outputs (on Opera 11.01): Code: (setOp) elemId = d1296668690535; val = 0 (fadeIn for) elemId = d1296668690535 (fadeIn for) elemId = d1296668690535 (fadeIn for) elemId = d1296668690535 (fadeIn for) elemId = d1296668690535 (fadeIn for) elemId = d1296668690535 (fadeIn for) elemId = d1296668690535 (fadeIn for) elemId = d1296668690535 (fadeIn for) elemId = d1296668690535 (fadeIn for) elemId = d1296668690535 (fadeIn for) elemId = d1296668690535 (setOp) elemId = [object HTMLDivElement] ; val = 0.1 (setOp) elemId = [object HTMLDivElement] ; val = 0.2 (setOp) elemId = [object HTMLDivElement] ; val = 0.30000000000000004 (setOp) elemId = [object HTMLDivElement] ; val = 0.4 (setOp) elemId = [object HTMLDivElement] ; val = 0.5 (setOp) elemId = [object HTMLDivElement] ; val = 0.6000000000000001 (setOp) elemId = [object HTMLDivElement] ; val = 0.7 (setOp) elemId = [object HTMLDivElement] ; val = 0.8 (setOp) elemId = [object HTMLDivElement] ; val = 0.9 (setOp) elemId = [object HTMLDivElement] ; val = 1 Why is an object reference assigned to what was previously a string? Thanks for the help! Hello im having trouble with my onclick button specifically the "doall" is there a problem with my function or the button? Console says ReferenceError: doAll is not defined but I have set the function doAll so I don't get what's wrong. <!DOCTYPE html> <HTML> <HEAD><TITLE>Choice</TITLE> <meta content="text/html;charset=utf-8" http-equiv="Content-Type"> <meta content="utf-8" http-equiv="encoding"> <SCRIPT Language="javascript"> muresources="" muresources["classical"]= "<A HREF='http://net.com/classical.file1'>Meditative classical music<A><P> <A HREF='http://net.com/classical.file2'>Provoking classical music<A>" muresources["rock"] = "<A HREF='http://net.com/rock.file1'>Popular rock music<A><P> <A HREF='http://net.com/rock.file2'>Exciting rock music<A>" muresources["ethnic"] = "<A HREF='http://net.com/mexican.file1'>Mexican music<A><P> <A HREF='http://net.com/Indian.file2'>Indian music<A>" function getLink() { temp = muresources[choice] temp2 = "<TITLE>Custom Links</TITLE><H3>" +document.m.pername.value+", here are some links for you</H3><P>"+temp } function writeIt(){ diswin = window.open(); diswin.document.open(); diswin.document.write(temp2); diswin.document.close() } function doAll(){ getLink(); writeIt() } </SCRIPT> </HEAD> <BODY > <H3> Choose the kind of music you prefer<BR> and this page will fetch links of interest to you</H3> <HR> <FORM NAME="m" > Choose a kind of music<P> <INPUT TYPE="radio" NAME="mus" VALUE="classical" OnClick="choice='classical'" >Classical <BR> <INPUT TYPE="radio" NAME="mus" VALUE="rock" OnClick="choice='rock'">Rock<BR> <INPUT TYPE="radio" NAME="mus" VALUE="ethnic" OnClick="choice='ethnic'">Ethnic<BR> <HR> Please type your name<P> <INPUT TYPE="text" NAME="pername" SIZE=25> <HR> <INPUT TYPE="button" NAME="sub" VALUE="Show me links" OnClick=doAll()> <INPUT TYPE="reset" NAME="res" > </FORM> <SCRIPT> choice = "classical" document.m.mus[0].checked = true document.m.mus[1].checked = false document.m.mus[2].checked = false </SCRIPT> </BODY> </HTML> Whole thread based on my mistake.
Code: $(document).ready(function(){
var theText=["Text one","Text two","Text three", "Text four"]; // Build the array of text
var arrayRows = theText.length; //Get the length of the array (Note: This starts at 1 not 0 like the array)
var i=0; //Set a counter
document.getElementById('textHere').innerHTML =theText[i]; //Fill in the space with the first piece of text
time = setTimeout("next()", 2000);
function next() {
if (i == (arrayRows-1)) {
i = 0;
}else {
i++;
}
$("#textHere").fadeOut("slow", function(){
document.getElementById('textHere').innerHTML =theText[i];
$("#textHere").fadeIn("slow");
});
}
function prev() {
if (i <= 0) { // If its below 0 go to the max
i = arrayRows-1;
}else {
i--;
}
$("#textHere").fadeOut("slow", function(){ //Fade out the area
document.getElementById('textHere').innerHTML =theText[i]; //Change the text to the next piece of text
$("#textHere").fadeIn("slow"); // Fade in the area
});
}
$("#prevText").click(function(e) {
e.preventDefault(); // Stop the link being a link
prev();
});
$("#nextText").click(function(e) {
e.preventDefault();
next();
});
});
When i click the links the functions work, however the setTimeout doesnt, can anyone help me figure this out? I am writing a greasemonkey userscript that simply just takes the underlying width of a td tag, and prints the text in white font over the table so it is viewable to everyone. I wrote the following code Code:
function main()
{
var page = document.getElementById("container");
var td = page.getElementsByTagName("td");
for(i=0; i<td.length; i++)
{
if(td[i].background-color != "")
{
td[i].style.color = "#ffffff";
td[i].innerHTML = td[i].width;
}
}
}
however, When i installed the script.. firefox tells me that "color" is not defined. Is there another way of doing this? Just wanting the width is white font. |
|||||||