|
JavaScript - Debugging??
I'm used to PHP, where I can use var_dump to find out about a variable wherever I call it. Or, having the script crash entirely and give me an idea of what mistake I made, when I made a mistake.
With JS, neither of those appear to be true. I was told I can use console.log or console.dir to get something similar to var_dump, but as you can see: it's giving me no output. I need a way to help me find the mistakes I make. How can I get console.dir to work? See the image below: Large image: http://i.imgur.com/4cw89OO.png Similar TutorialsI've been working on that for days, and can't find the problem. Could one of you help? I wrote a low-level digit-shift cipher, but the script doesn't work. Code: <head>
<script type="text/javascript">
function ciphertext()
{
var t = document.getElementById.('t')
t = t.toUpperCase()
var n = 0
var o = ""
if(n=0)
{
o=o+t
n=n+1
}
if(n=1)
{
if(t=="A")
o=o+"B"
if(t=="B")
o=o+"C"
if(t=="C")
o=o+"D"
if(t=="D")
o=o+"E"
if(t=="F")
o=o+"G"
if(t=="G")
o=o+"H"
if(t=="H")
o=o+"I"
if(t=="I")
o=o+"J"
if(t=="J")
o=o+"K"
if(t=="K")
o=o+"L"
if(t=="L")
o=o+"M"
if(t=="M")
o=o+"N"
if(t=="N")
o=o+"O"
if(t=="O")
o=o+"P"
if(t=="P")
o=o+"Q"
if(t=="Q")
o=o+"R"
if(t=="R")
o=o+"S"
if(t=="S")
o=o+"T"
if(t=="T")
o=o+"U"
if(t=="U")
o=o+"V"
if(t=="V")
o=o+"W"
if(t=="W")
o=o+"X"
if(t=="X")
o=o+"Y"
if(t=="Y")
o=o+"Z"
if(t=="Z")
o=o+"A"
else
o=o+t
n=n-1
}
document.getElementById('op').innerHTML = o.value
}
</script>
</head>
<body>
<b id="op">This is your result</b>
<input type="text" id='t' />
<button onclick="ciphertext()">Submit</button>
</body>
I've been working on that for days, and can't find the problem. Could one of you help? (Pardon me if I am being blunt, but why doesn't this work?) I've been messing with this for hours and I can't seem to find where I've gone wrong with it, I think I need a fresh pair of eyes to give it a look over. Anyways here's my entire piece of code. I know it's a lot to look at but if anyone can help me get this working that would be great, it's starting to give me a headache just to look at it. Anyways from what I can tell the problem is somewhere in the wDesQuote() function but I can't seem to pin it down. Code: //Start Ajax Code
var XMLHttpRequestObject = false;
if (window.XMLHttpRequest)
{
XMLHttpRequestObject = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
}
function getData(dataSource, divID){
if(XMLHttpRequestObject){
var obj = document.getElementById(divID);
XMLHttpRequestObject.open("GET", dataSource);
XMLHttpRequestObject.onreadystatechange = function(){
if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200){
obj.innerHTML = XMLHttpRequestObject.responseText;
}
}
XMLHttpRequestObject.send(null);
}
}
//End Ajax Code
//Start Div Updater
function textUpdate(text, divID){
if(XMLHttpRequestObject){
var obj = document.getElementById(divID);
obj.innerHTML = text;
XMLHttpRequestObject.send(null);
}
}
//End Div Updater
//Money Formater
function roundNumber(num, dec) {
var result = Math.round(num*Math.pow(10,dec))/Math.pow(10,dec);
return result;
}
//End Money Formater
function wDesQuote()
{
var eBizCard = document.getElementById('eBizCard').checked;
var basic = document.getElementById('basic').checked;
var mobile = document.getElementById('mobile').checked;
var pages = document.getElementById('pages').value * 20;
var host = document.getElementById('hostY').checked;
var cTemp = document.getElementById('cTemp').checked;
var anime = document.getElementById('anime').checked;
var addMobile = document.getElementById('addMobile').checked;
var eComP = document.getElementById('eComP').checked;
var eComI = document.getElementById('eComI').value;
var eComQ = 0;
var forum = document.getElementById('forum').checked;
var blog = document.getElementById('blog').checked;
var wUpd = document.getElementById('wUpd').checked;
var bUpd = document.getElementById('bUpd').checked;
var mUpd = document.getElementById('mUpd').checked;
var nUpd = document.getElementById('nUpd').checked;
var logo = document.getElementById('logo').checked;
var bCard = document.getElementById('bCard').checked;
var pCard = document.getElementById('pCard').checked;
var brochure = document.getElementById('brochure').checked;
var mTotal = 0;
var uTotal = 0;
if(eBizCard == true && host == true){
uTotal = 149.95;
mTotal = 9.95;
}else if(eBizCard == true && host == false){
uTotal = 149.95;
mTotal = 0;
}else if(mobile == true && host == true){
uTotal = 299.95;
mTotal = 9.95;
}else if(mobile == true && host == false){
uTotal = 299.95;
mTotal = 0;
}else{
eBizCard = 0;
mobile = 0;
basic = 499.95;
if(host == true){
host = 9.95;
} else{
host = 0;
}
if(cTemp == true){
cTemp = 100;
}else{
cTemp = 0;
}
if(anime == true){
anime = 150;
}else{
anime = 0;
}
if(addMobile == true){
addMobile = 275;
}else{
addMobile = 0;
}
if(eComP == true){
eComP = 200;
eComQ = roundNumber(eComI * 0.59,2).toFixed(2);
if(eComQ == "NaN"){
alert("Please enter numbers only into the item quantity box");
break;
}
}else{
eComP = 0;
eComI = 0;
}
if(forum == true){
forum = 50;
}else{
forum = 0;
}
if(blog == true){
blog = 50;
}else{
blog = 0;
}
if(wUpd == true){
wUpd = 175;
}else{
wUpd = 0;
}
if(bUpd == true){
bUpd = 100;
}else{
bUpd = 0;
}
if(mUpd == true){
mUpd = 60;
}else{
mUpd = 0;
}
if(nUpd == true){
nUpd = 0;
}else{
nUpd = 0;
}
if(logo == true){
logo = 75;
}else{
logo = 0;
}
if(bCard == true){
bCard = 90;
}else{
bCard = 0;
}
if(pCard == true){
pCard = 140;
}else{
pCard = 0;
}
if(brochure == true){
brochure = 280;
}else{
brochure = 0;
}
}
var uTotal = pages + cTemp + anime + addMobile + eComP + eCompQ + forum + blog + wUpd + bUpd + mUpd + nUpd + logo + bCard + pCard + brochure;
var mTotal = host + mUpd + bUpd + wUpd + nUpd;
if(mTotal == 0){
document.getElementById('totalDisplay').innerHTML = "Your total is $" + uTotal;
}else{
document.getElementById('totalDisplay').innerHTML = "Your total is $" + uTotal + " a monthly fee of $" + mTotal;
}
}
what is wrong with this Code: function addfavorites(classid,userid) { // alert("here"); var urltoajax = "addfavorites.php?j=1&classid="+ classid + "&userid="+ userid; urltoajax = urltoajax + '&rnd=' + Math.round(Math.random() * 10000) alert(urltoajax); $.ajax({ url: urltoajax, cache: false, success: function(html) { $("#message").html(html); } }); //alert('here 2'); } i get an error Object doesn't support this property or method In short, what's wrong with this? I'm sure you'll test it, but it just posts the JS inside the Bold tag instead of the grade. This includes the innerHTML script. Code: <html>
<head>
<script type="text/javascript">
function grade()
{
var tot = 1;
var g = 0;
var qId0 = document.getElementById('0').value;
if (qId0 == "t")
{
g = g + 1;
}
g = g / tot;
g = g * 100;
document.getElementById("grade").innerHTML = grade;
}
</script>
</head>
<body>
<b id="grade">Your Grade Here</b>
<ol>
<li><select id="0">
<option value="d">Test Question</option>
<option value="f">false</option>
<option value="t">true</option>
<option value="f">false</option>
</select>
<button onclick="grade()">Submit</button>
</body>
</html>
When I hit "submit" with the right answer, I get: function grade() { var tot = 1; var g = 0; var qId0 = document.getElementById('0').value; if (qId0 == "t") { g = g + 1; } g = g / tot; g = g * 100; document.getElementById("grade").innerHTML = grade; } When I hit "submit" with the wrong answer, I get the same. Can someone explain this to me and tell me how to fix it? (Also, I would appreciate it if you could point out any unrelated bugs you come across ) This question hovers between PHP and JavaScript, but I think it fits here a little better. I've got a web app that does a lot of asynchronous calls to various PHP pages. I'm familiar with using an iFrame or div to hold a controller, then making forms post to that controller so you can see the output. However, I'm not doing a lot of submitting forms. Typically, I utilize the onclick event of various elements to initiate an XmlHttpRequest that jumps over to a PHP page and back. I'm looking for a way to easily debug my PHP code. Right now I'm using Firebug (on Firefox) to look at the HTTP requests. I can see the post data and response and all that, which is good. However, it requires a good amount of clicking and time to get to that data. Is there an easier way to do this? Ideally I'd love to include some sort of debug window that displays all of the PHP controller errors and things that I echo out. Hi everybody. I've been trying to figure out how to fix the following error I get in the latest Internet Explorer for marinebio.org: Message: 'this.submenus[...].getElementsByTagName(...).0' is null or not an object Line: 547 Char: 3 Code: 0 URI: http://marinebio.org/_n/s/main.js The code at line 547 in main.js is: Code: this.submenus[i].getElementsByTagName("span")[0].onclick = function() {
in the function: Code: SDMenu.prototype.init = function() {
var mainInstance = this;
for (var i = 0; i < this.submenus.length; i++)
this.submenus[i].getElementsByTagName("span")[0].onclick = function() {
mainInstance.toggleMenu(this.parentNode);
};
if (this.markCurrent) {
var links = this.menu.getElementsByTagName("a");
for (var i = 0; i < links.length; i++)
if (links[i].href == document.location.href) {
links[i].className = "current";
break;
}
}
if (this.remember) {
var regex = new RegExp("sdmenu_" + encodeURIComponent(this.menu.id) + "=([01]+)");
var match = regex.exec(document.cookie);
if (match) {
var states = match[1].split("");
for (var i = 0; i < states.length; i++)
this.submenus[i].className = (states[i] == 0 ? "collapsed" : "");
}
}
};
I've been using the Dynamic Drive's Slashdot sliding menu script for at least a year without any problems. All pages validated before the ads were added. I've pulled nearly all other scripts but it still errors out. Works fine in FF and Chrome. Going to strip the home page to nothing and start building it back but if anyone has any ideas, I'd really appreciate it. Maybe it's time to upgrade the vertical sliding menu script entirely, if anyone can recommend a better one, that would be great too. I know just enough javascript to be dangerous apparently.... first of all, hello all i found this forum while running out of ideas and being extremely desperate to fixing a probably small javascript error in a script. the script is supposed to open a small form window that allows the user to input an email address and update it to proceed. the form item is initially unchecked, but as the user clicks it and enter his email address, it updates the value of the email address and the box becomes "checkable". the problem is that with both IE and firefox, the box doesn't close again, doesn't get checkable and basically doesn't work. in the firefox debugging console, I found the following error: Quote: Error: document.getElementById(input_array[i]) is null Source File: sell_item.php Line: 1106 does anyone have an idea what could be wrong? the part responsible in the javascript for this section is: Code: <script language="javascript">
function pg_popup_open(id)
{
if (document.getElementById(id).style.display == 'block')
{
document.getElementById(id).style.display = 'none';
}
else
{
document.getElementById(id).style.display = 'block';
}
return false;
}
function pg_update_settings(id, input_array)
{
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request");
return;
}
var url = '' + 'ajax_files/direct_payment_box.php';
var action = url + '?id=' + id + '&user_id=' + 100001;
var chk_disabled = false;
for ( var i in input_array )
{
action += '&' + input_array[i] + '=' + document.getElementById(input_array[i]).value;
if (document.getElementById(input_array[i]).value == '')
{
chk_disabled = true;
}
}
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4)
{
var response = xmlHttp.responseText;
}
};
xmlHttp.open("GET", action, true);
xmlHttp.send(null);
document.getElementById('checkbox_' + id).disabled = chk_disabled;
if (chk_disabled == true)
{
document.getElementById('checkbox_' + id).checked = false;
}
document.getElementById(id).style.display = 'none';
return false;
}
</script>
and the html code that is supposed to pop up the box is: Code: <input type="checkbox" name="payment_gateway[]" id="checkbox_pg_paypal" value="1" disabled>
<span class="contentfont"><a href="javascript:;" onclick="pg_popup_open('pg_paypal');">PayPal</a></span>
<script language="javascript"> var array_pg_paypal = new Array(); array_pg_paypal[0] = 'pg_paypal_email';</script>
<div class="smallfont"><b>PayPal Email Address</b><br>
<input type="text" name="pg_paypal_email" id="pg_paypal_email" value="" /></div>
<div align="right"><input type="button" value="Proceed" onclick="pg_update_settings('pg_paypal', array_pg_paypal);" /></div>
i understand this is asking a lot, but if someone has a spare second that is a javascript guru, i promise i will name my first born after you!! lol I am trying to debug this with FireBug Code: function chapter12_nodeOne() {
//create an element
var element = document.createElement('input');
//set some attributes
element.setAttribute('type', 'button');
element.setAttribute('value', 'submit');
//appendd the element into a DIV
document.getElementById('myDiv').appendChild(element);
//uses EventUtil to attach an event listener
(1) EventUtil.addHandler(element, 'click', function() { alert('added event handler') });
}
var EventUtil = {
(2)addHandler: function(element, type, handler) {
//check if the element and the browser support DOM Level 2 event attachment
//if the user is not browsing with IE
if (element.addEventListener) {
element.addEventListener(type, handler, false);
}
//if user is browsing with IE
else if (element.attachEvent) {
element.attachEvent("on" + type, handler);
}
//if user is using a browser that only supports DOM Level 0 event attachment
else {
element["on" + type] = handler;
}
},
removeHandler: function(element, type, handler) {
//check if the element and the browser support DOM Level 2 event attachment
//if the user is not browsing with IE
if (element.removeEventListener) {
element.removeEventListener(type, handler, false);
}
//if user is browsing with IE
else if (element.detachEvent) {
element.detachEvent("on" + type, handler);
}
//if user is using a browser that only supports DOM Level 0 event attachment
else {
element["on" + type] = null;
}
},
preventDefault: function(event)
{
if(event.preventDefault)
{
event.preventDefault();
}
else
{
event.returnValue = false;
}
}
};
I put a breakpoint on the line marked with (1), I am trying to go to line (2) with all the available options FireBug gives, but unfortunately I get the end of chapter12_nodeOne function. Any ideas why? This page should work, but it doesn't. My debugging says that I have a invalid character on line 2 and on line 39 it is "object expected". Here's the page: <HTML> <HEAD> <TITLE>The Golf Page</TITLE> <STYLE> BODY {font-family:Arial, Helvetica, sans-serif; font-size: 18pt; color:blue; background-color:rgb(255,255,128)} </STYLE> <SCRIPT SRC="Ball.gif"> var x = new Array(-395, -389, -383, -377, -371, -365, -359, -353, -346, -340, -334, -328, -322, -316, -310, -304, -297, -291, -285, -279, -273, -267, -261, -255, -248, -242, -236, -230, -224, -218, -212, -206, -199, -193, -187, -181, -175, -169, -163, -157, -150, -144, -138, -132, -126, -120, -114, -108, -101, -95, -93, -91, -88, -86, -83, -81, -78, -76, -73, -71, -69, -66, -64, -61, -59, -56, -54, -51, -49, -47, -44, -42, -39, -37, -34, -32, -29, -27, -24, -22, -20, -17, -15, -12, -10, -7, -5, -2, 0); var y = new Array(-300, -300, -300, -299, -298, -297, -296, -294, -292, -290, -288, -285, -282, -279, -276, -272, -268, -264, -260, -255, -250, -245, -240, -234, -228, -222, -216, -209, -202, -195, -188, -180, -172, -164, -156, -147, -138, -129, -120, -110, -100, -90, -80, -69, -58, -47, -36, -24, -12, 0, -5, -10, -14, -18, -22, -25, -29, -32, -34, -37, -39, -41, -43, -45, -46, -47, -48, -48, -48, -48, -48, -48, -47, -46, -45, -43, -42, -40, -37, -35, -32, -29, -26, -23, -19, -15, -11, -6, 0); index=0 function moveBall() { if(index <=[x.length-1]) { placeIt("Ball", x[index], y[index]); index++; setTimeout("moveBall()", 5); } else { ("showIt()", 5); setTimeout("showIt('Slogan')", 5); setTimeout("showIt('Slogan1')", 10); setTimeout("showIT('Marquee')", 15); } } </SCRIPT> </HEAD> <BODY onLoad="moveBall(Ball);"> <DIV ID="Marquee" visibility:hidden font-family: Time New Roman, Times, serif; font-style:italic> <CENTER> <MARQUEE BGCOLOR="#BBBBBB"> A beautiful day for GOLF...Sunny...No WINDS...TEMP:68-70 </MARQUEE> </CENTER> </DIV> <SCRIPT SRC="Golf.js"></SCRIPT> <DIV ID="Title" STYLE="border-left:1px solid blue; border-right:3px solid blue; border-top:1px solid blue; border-bottom:3px solid blue; padding-left:395;padding-top:260;padding-bottom:0; background-color:rgb(0,255,0)"> THE G<SPAN ID="Ball" position:relative; left:0; top:0><IMG SRC="Ball.gif" BORDER=0 width="17" height="17"></SPAN>LF PAGE </DIV> <DIV ID="Slogan" STYLE="color:black; font-family: Times New Roman, Times, serif; font-style:italic; font-weight:bold; position:absolute; left:120; top:100; z-index:2; visibility:hidden"> Your Online Source of Golf Equipment </DIV> <DIV ID="Slogan2" STYLE="color:white; font-family: Times New Roman, Times, serif; font-style:italic; font-weight:bold; position:absolute; left:121; top:101; z-index:1; visibility:hidden"> Your Online Source of Golf Equipment </DIV> </BODY> </HTML> The function moveBall and its contents should be checked as well, although it should be correct. But the page won't load properly. The marquee is suposed to be hidden until the function executes, and it is displayed. As far as I know the only errors are in the onLoad and function, everything else is right. Any help would be appreciated. Thanks Hello, I'm a student web developer. I'm debugging some JavaScript code I just created that simply extracts a table, reorders it and replaces it when the user clicks on a button ('Order results' - top right of the table). (It's a small script). It's for a PHP based polling application, completely of my own creation, which is under construction (only the JavaScript doesn't work). You can see all the code if you use Firebug. Go to the following link and vote for something; that will take you to a page the JavaScript is located. http://www.samuellockyer-development...s/examples.php (I'm linking because I think the context of the page may help.) (Notice the type error alert.) (Update: Not anymore.) (There are NO syntax errors.) You will find the area of the bug quickly by looking at the comments. (Marked by !!BUG!!) (Update: Not anymore, look at the posts below to find them now.) I am very new to JavaScript, but I wrote all the code, so I will be able to answer questions easily. This is a last resort by the way, I need this to work within about two days and I would be SO grateful for any help!! You can vote as many times as you like - I can just zero everything before I demo the app. I've been playing around with a madlibs exercise while trying to learn simple javascript. I have three input boxes and a button display an alert containing the input from the boxes. Am I right to be assigning variable names to the values from the text boxes and then referencing those variables in my alert? I'm sorry if this is a dumb question but I've been working on it for hours and can't get past this point. Inset a name: <input type="text" id="textbox1" size="10"/> </br> Insert a verb : <input type="text" id="textbox2" size="10"/> </br> Insert a place: <input type="text id="textbox3" size="10"/> <input type="button" value="CLICK WHEN FINISHED" onClick="name = document.getElementById('textbox1').value; verb = document.getElementById('textbox2').value; place = document.getElementById('textbox3').value; alert('Mad Lib :' + name + " " + verb + " " + place);" /> |
|||||||