JavaScript - Someone Please Help! Simple Loading Page Question (have Looked Everywhere For Answer)

Hey guys, basically Im creating a webpage for my univeristy degree, and I've decided to script a quiz, basically there will be several multi choice questions, and these will add to one answer, heres an example:

Whats your favourite genre of music?
(choice1)
(choice2)
(choice3)
Whats your favourite favourite musical instrument?
(choice1)
(choice2)
(choice3)

etc

answer = blahblahblah

Heres my questions code here, as you can see im using values, im trying to create the answers by adding the values up, for example answer 1=5
2=10
3=100

<div id="quiz">
<h4>
1) What is your favourite genre of music?</div>
<div class="qselections">
<input type="radio" value="1" name="question1">a)Rock<br>
<input type="radio" value="2" name="question1">b) Punk<br>
<input type="radio" value="3" name="question1">c) Metal<br>
<input type="radio" value="4" name="question1">d)Electronica/Dance/Club<br>
</div>

<br>

<div class="qheader">
2) What is your favourite decade of music></div>
<div class="qselections">
<input type="radio" value="1" name="question2">a) 60's<br>
<input type="radio" value="2" name="question2">b) 70's<br>
<input type="radio" value="3" name="question2">c) 80's<br>
<input type="radio" value="4" name="question2">d) 90's<br>
<input type="radio" value="5" name="question2">d) 00's<br>
</div>

<br>

<div class="qheader">
3) Which is your favourite instrument?</div>
<div class="qselections">
<input type="radio" value="1" name="question3">a) Guitar<br>
<input type="radio" value="2" name="question3">b) Drums<br>
<input type="radio" value="3" name="question3">c) DJ Decks<br>
<input type="radio" value="4" name="question3">d) Piano<br>
</div>
<br>

<div class="qheader">
4) Do you prefer handheld or console?</div>
<div class="qselections">
<input type="radio" value="1" name="question4">a) Handheld<br>
<input type="radio" value="100" name="question4">b) Console<br>
<h4>
</div>

Im just curious how to script this? I havent done anything this difficult before, Im wondering how I would code this.. The only quiz I have done before is via prompts, any help will be much apprieciated!

P.s feel free to ask any questions if it is to help!

I have just used an Analysis Quiz tool (on this page http://javascript.about.com/library/blquizf.htm) to create a quiz which doesn't have right or wrong answers but adds the scores of the answers together. It all works nicely, HOWEVER I require 5 answers as opposed to the maximum of four which has been offered on this site.

The (partial) code is:

Code:

 var quiz = new Array(); var r = 0;
var analPage = 'result.html';
quiz[r++] =('93726~71~1. How often do you have a drink containing alcohol?~Never~Once a month or less~2 to 4 times a month~2 to 3 times a week~0~3');
quiz[r++] =('48844~37~How many units of alcohol do you have on a typical day when you are drinking?~1-2~3-4~5-6~7-9~0~3');

I thought it would be straight forward and I could add another option at the end of each string and then change the scoring e.g.
quiz[r++] =('93726~71~1. How often do you have a drink containing alcohol?~Never~Once a month or less~2 to 4 times a month~2 to 3 times a week~4 or more times a week~0~4');
but this didn't work ... please help! Thank you

Just a basic question.... I am fairly new here. Just wondering if this is just a part of life. It seems like when I load javascript code into a page, that each item I add, such as an accordian vertical navbar, image slider, etc, that each time I add one, the page loads a second or so slower with each one added. I would like some of these features, but is this just a part of life, or are there tricks to avoid the slower load time? It is not major time but after the 2 items I mentioned, it added on about 2 seconds. Just enough to make it a bit annoying.

I read that $(document).ready(function() might slow me down but I do not see that statement in any of my .js files.
Thanks, Buffmin.

This is my first post on this website. It has a very clean design to it. I think I am going to enjoy myself here :P



I am taking a class. And I am very sorry if this post does not belong here. It is a JavaScript class so, my guess was here.

My professor has giving us three page sources from random sites. I can not figure this out though. This question has a page source from some random math test website. What we are to do with this page source is to figure out the ten correct answers to the question in the page source. No, not by doing the math, but figuring out where in the page source it is hiding. I can not find them for the life of me. I got the other two problems, but of course this is the hardest one

Thank you for your help
I put the page source in a notepad attach to this post.


(My professor has removed parts of codes that included the name of the website he had gotten it off of. He also said the page source may need to be decoded.) I think I found what I am looking for. If you look where question one starts. Itll have <input type="hidden" name="corAns" value="27478035">

But, the answers are A, B, C, and D which would be 1, 2, 3, and 4 for D. So is <input type="hidden" name="numAns" value="4"> The correct line?

I think that is to easier. He said this assignment was the hardest out of the three, and well, that was to easy?

Hello all,

I have the following code to load a new html page into the 'new content' div once the user scrolls to the bottom of the page.

It all works fine. No problems, except I would like it to pause for a moment whilst it is loading, and show a loading box div at the bottom of the screen as it loads the new content, just to give some positive feedback for the user.

So the new div would sit in a fixed position at 'bottom:0px;' and have a loading image inside it.

Is this easy to do? I am new to javascript so bear with me

Code:

alreadyloading = false;
nextpage = 2;
 
$(window).scroll(function() {
    if($(window).scrollTop() + $(window).height() == $(document).height()) {
        if (alreadyloading == false) {
            var url = "page"+nextpage+".html";
            alreadyloading = true;
            $.post(url, function(data) {
                $('#newcontent').children().last().after(data);
                alreadyloading = false;
                nextpage++;
            });
        }
    }
});

The 'new content' is a div which is at the bottom of the page and is where the new content loads to!

Thank you very much

I typed this code straight out of the book and it just doesn't seem to work. I have the headlines on the left side and when clicked the contents of the headline is supposed to show up in the text box on the right. Well, needless to say, nothing appears. Please someone tell me what I am doing wrong. I am not the only person in the class having this issue. Thanks a million.

Code:

<!DOCTYPE HTML>

<!--mwelborn-->
<!--Chapter 8 Page 475-->
<!--October 25, 2011 -->

<html>

<head>

<title>News Items</title>

<script type="text/javascript">
/* <![CDATA[ */

var newsItem1 = "L'AQUILA, ITALY (AP) - L'Aquila's
		 chief prosecutor announced an investigation
		 into allegations of shoddy construction as
		 people sill missing after a devastating
		 earthquake five days ago.
		 http://in.reuters. com/article/
		 idUSWBT01103020090411;

var newsItem2 = "WASHINGTON (Reuters) - President
		Barack Obama said on Friday the recession-
		hit US economy was showing 'glimmers of
		hope' despite remaining under strain and
		promised further steps in coming weeks to
		tackle the financial crisis.
		http://in.reuters.com/article.
		idUSWBT01103020090411";

var newsItem3 = "(eweek.com) - Apple is close to
		hitting 1 billion downloads from its App
		Store and plans on a prize giveaway fo
		whoever downloads the billionth application
		that includes a MacBook Pro and an iPod
		Touch. http://www.eweek.com/c/a/
		Application-Development/eWeek-Newsbreak
		-April-13-2009/";

var newsItem4 = "ATLANTA (AP) - Chipper Jones
		drove in two runs, including a tiebreaking
		single, and the Atlanta Braves beat
		Washington 8-5 on Sunday to hand the
		Nationals their sixth straight loss to
		start the season.
		http://www.newsvine.com/_news/2009/04/11
		2667835-jones-braves-beat-winless
		-nationals-8-5?category=sports";
/* ]] */
</script>
</head>

<body>

<form name="newsHeadlines" action=""  method="get">
	<table style="border: 0; width: 100%">
	      <tr valign="top">
		<td>
		     <select name="newsHeadlines" multiple="multiple"
		      style="height: 93px">

			<option onclick="document.newsHeadlines
			.news.value=newsItem1">
			Investigation of building standards in
			quake zone</option>

			<option onclick="document.newsHeadlines
			.news.value=newsItem2">
			Obama sees signs of economic progress</option>

			<option onclick="document.newsHeadlines
			.news.value=newsItem3">
			Apple App Downloads Approach 1 Billion</option>

			<option onclick="document.newsHeadlines
			.news.value=newsItem4">
			Jones, Baves beat winless Nationals 8-5</option>

		      </select>
		</td>
		<td>
		     	<textarea name="newsHeadlines" cols="50" rows="10"
		     	style="background-color: Transparent"></textarea>
		</td>
	      </tr>
	</table>
</form>

</body>
</html>

Hello. My goal is to load the JS for a specific element before displaying that element. I integrated a third part script, and it works well. I set the timer he

The JS is in my heading as <script type="text/javascript" src="countdownpro.js"></script>

About mid-body I have: <span id="countdown1">2010-07-20 00:00:00 GMT+00:00</span> which allows for the setting of a target date to countdown to.

When the page first loads it shows the above long format target time, until the js/meta tags kick in to modify it to just show the actual countdown as 00:00:00.

I have attached countdownpro.js to this post. I tried shifting the function CD_Init() to the top of the script, and also appended it inline with the .html. I tried setting the big external script to "defer", but neither arrangement worked. I also tried placing the src file right at the top.

I appreciate your help.

I have an entirely javascript page that once it is done it still looks like it is loading. This is more of an annoyance than anything harmful. The page can be viewed at http://mikedombrowski.com/mRNA.html
Thank you for your help in advance.

Hello,

I'm creating a section for a school website that will list over 9,000 book titles in four different categories (by Title, by Author, by Book Level, and by Points).

The content is shown in a div and called and loaded via Ajax.

Here is the test page: http://www.gilchrist.leon.k12.fl.us/ar/artest.htmlAfter you click "Go" when the drop down menu is displaying By Book Title, the content loads in the div in a few moments.

Here is the content page that appears in the div after you click "Go":
http://www.gilchrist.leon.k12.fl.us/...tByAuthor.html

If possible, I need a "page loading..." script that will appear only after you click "Go" while the list of books is being loaded.

I've been testing different ones I've found online, but can't get any to work. Of course, I'm not even sure if the script would be added to artest.html, 1112-QuistListByTitle.html, or a combination of both...

Any help with this would be greatly appreciated.

Thank you,
Deborah

Something is up with my coding, when I try to load the page.. it will only load in notepad. Help!


<html>
<head>
<title>Other ways to help</title>

<SCRIPT TYPE="text/javascript">
<!--
function dropdown(mySel)
{
var myWin, myVal;
myVal = mySel.options[mySel.selectedIndex].value;
if(myVal)
{
if(mySel.form.target)myWin = parent[mySel.form.target];
else myWin = window;
if (! myWin) return true;
myWin.location = myVal;
}
return false;
}


function validateForm(form) {
var fName = form.txtFname.value;


var dataIsValid = true;

var errMsg = "The following inputs are missing or invalid:\n\n";


if(fName == '') {
errMsg = errMsg + "First Name\n";
dataIsValid = false;
}


if(lName == '') {
errMsg = errMsg + "Last Name\n";
dataIsValid = false;
}




if(dataIsValid) {
return true;
} else {
alert(errMsg);
return false;
}
}

//-->
</SCRIPT>

</head>

<body>
<a name="other">
<body background="otherbackground.jpg">
<center><table border="2" cellspacing="2" width="900" height="190" bordercolor="#000000">
<tr>
<td width="60%" td bgcolor="white">
<b>To make a donation, fill and submit the following form. You can also make a cash donation directly by filling out your credit card information.<br/>
Also, be sure to check yes if you would like to subscribe to our online monthly newsletter.</b><br/>
<form name="Donations" method="post" action="#" onsubmit="validateForm(this);">
First Name<input type="text" name="txtFname" size="25" tabindex="1">
M.I.<input type="text" name="M.I." size="1">
Last Name<input type="text" name="Last Name" size="25"><br/>
Street Address<input type="text" name="Street Address" size="25">
Street Address 2<input type="text" name="Street Address 2" size="25"><br/>
City<input type="text" name="City" id="myCity" size="20">
State<input type="text" name="State" size="2">
Zip<input type="text" name="Zip Code" size="10"maxlength="9"><br/>
Email<input type="text" name="Email" size="25"><br/>
Credit Card Number<input type="text" name="Credit Card Number" size="10"maxlength="8">
Expiration Date<input type="text" name="Expiration Date" size="5">
Security Number<input type="text" name="Security Number" size="3"maxlength="3">
<textarea cols="50" rows="4" name="Comments">Comments or Questions:</textarea><br/>
Subscribe to newsletter? <input type="radio" name="choices" value="Yes">Yes<input type="radio" name="choices" value="No">No<br/><br/>
<input type="submit" value="Submit">
<input type="reset">
</form><br/>
</table><br/>

<FORM
ACTION="../cgi-bin/redirect.pl"
METHOD=POST onSubmit="return dropdown(this.gourl)">
<SELECT NAME="gourl">
<OPTION VALUE="">Choose a Destination...
<OPTION VALUE="home.html">Home Page
<OPTION VALUE="dogs.html">Learn About Dogs
<OPTION VALUE="cats.html">Learn About Cats
<OPTION VALUE="exotics.html">Learn About Exotics
<OPTION VALUE="other.html">Other Ways To Help
</SELECT>
<INPUT TYPE=SUBMIT VALUE="Go">
</FORM>
<br/><br?>

</body>

</html>

Hi i have the following

Code:

<script type="text/javascript">
$(document).ready(function () {
    window.name = "main";
    $("#uploadSubmit").bind("click", function () {
        //edit below to suit
        var src = "uploader.php";
        //end
        var results = '<iframe src="' + src + '" name="uploader" id="uploaderIframe"></iframe>';
        $("#uploader").append(results);
        $("#uploadResult").html('Uploading please wait... <img src="images/loader.gif" />');
        $("#uploaderIframe").load(function () {
                var iframeHtml = $('#uploaderIframe').contents().find("body").html();
                $("#uploadResult").html(iframeHtml);
                $("#uploaderIframe").remove();
                main.execCommand('Stop');
                main.stop();
        });
    }); 
});
</script>

works perfectly but the main page keeps loading once the iframe is removed. Any know why and how i can terminate the loading?

Basically, I have a total of three different JavaScripts that need to be loaded when the user opens the page; let's call them script_a.js, script_b.js, and script_c.js

script_a.js and script_b.js each need to be loaded on every page; however, they do very different things (one displays text, the other creates buttons), and in the interest of readability and ease of editing later, I want to keep them separate.

script_c.js only needs to be loaded on one page; there will be a few variants (script_c2, script_c3, etc), but again, each of them only needs to be loaded on a single page.

The scripts are also too large and unwieldy for me to put them directly into the HTML (basically because I have to do a lot of different switches, and conditionals, and output formatting).

At present, the only way I know how to load a JavaScript is to use window.onload, so obviously I'm getting into the issue of competing onLoads.

Any help would be appreciated!

Hi, nothing to serious, but definitely annoying. Every time i load my page, it loads to the halfway Y position down the page. I want to page to always load top every time it is refreshed or referenced to. You can see the problem here. Try and go to www.simeoncreative.com and click on any of the menu nav links. the page will load, but just halfway down the page. I tried both the

Code:

$(document).load().scrollTop(0);

and

Code:

$(document).ready(function(){
    $(this).scrollTop(0);
});

JS codes in the linked .js file. How can I fix this? Thanks in advance for any help.

So I have an HTML page with javascript that takes input values, computes some results, and then puts these results in a table. Works great. Now I realize some users might want to print just the results table. So I add a button that allows the user to request the table in a separate window; clicking the button invokes a script to re-create the table in a separate window. Works fine except:

* In the status bar, the window appears to never finish loading
* If you go to File -> Print then nothing seems to happen; however,
if you close the generated window _then_ the print dialog appears;
the window you want to print, however, is gone.

Any suggestions?

The code invoked by clicking the newly added button:

[CODE]
function grabResults()
{
var w = window.open("","ROIResults"+winCount++,
"height=400,width=600,menubar=yes");
var d = w.document;
d.write('<head>');
d.write('<link href="style.css" title="compact" rel="stylesheet" type="text/css" />');
d.write('<title>Return On Investment Calculations</title>');
d.write('</head>');
d.write('<body>');
d.write('<div id="logoholder">');
d.write(' <img src="TTFlogo2.gif" alt="Cannott display logo" "width="322" width="322" height="51"></p>');
d.write('</div>');
d.write('<div id="header">');
d.write(' <h2>Return on Investment Estimator for Classroom Training</h2>');
d.write('</div>');
d.write('<table rules="all" frame="box">');
d.write('<caption>Results - Estimated ROI</caption>');
d.write(' <tr><th>Course</th>');
d.write('<td class="center" id="courseName">'+cname+'</td>');
d.write(' </tr>');
d.write(' <tr><th>Duration (Days)</th>');
d.write('<td class="center" id="courseDur">'+cdays+'</td>');
d.write(' </tr>');
d.write(' <tr><th>Class Size</th>');
d.write('<td class="center" id="courseSize">'+csize+'</td>');
d.write(' </tr>');
d.write(' <tr><th>Location</th>');
d.write('<td class="center" id="courseLoc">'+teach_loc+'</td>');
d.write(' </tr>');
d.write(' <tr><th>Training Cost</th>');
d.write('<td class="justr" id="courseCost">'+TC+'</td>');
d.write(' </tr>');
d.write(' <tr><th>Initial Value</th>');
d.write('<td class="justr" id="courseInitial">'+startValue+'</td>');
d.write(' </tr>');
d.write(' <tr><th>Returned Value</th>');
d.write('<td class="justr" id="courseValue">'+RV+'</td>');
d.write(' </tr>');
d.write(' <tr><th>Increase in Value</th>');
d.write('<td class="justr" id="courseIncr">'+Inc+'</td>');
d.write(' </tr>');
d.write(' <tr><th>Net ROI after costs</th>');
d.write('<td class="justr" id="courseROI">'+ROI+'</td>');
d.write(' </tr>');
d.write(' <tr><th>ROI Rate</th>');
d.write('<td class="justr" id="courseROIRate">'+ROIR.toFixed(2)+'%</td>');
d.write('</tr> '); */
d.write('</table>');
d.write('<p class="in3">(All amounts are in US Dollars.)</p>');
d.write('</body>');
d.write('</html>');

d.close();
return true;
}

[ICODE]

Hi, I'm writing a page scraper in javascript which involves loading a page to scrape, detecting when the page has loaded successfully and then scraping the data. I can get the 'page loading detection' to work if I load the page in a sub-frame. But this is no good as some sites include frame-buster code which breaks my scraper and I cant get any of the framebuster-buster solutions to work. So instead I decided to look at loading the page in a separate tab. Does anyone know how to reliably detect when a page has finished loading in a tab please?
I am using Firefox only and I dont mind if the solution requires some extension or greasemonkey script (I have already added the configuration/commands to allow access to pages from different domains).

The code below shows an attempt. It sometimes detects when the initial page has loaded but when I press 'submit' it doesnt detect the second loading.
Thanks.
Code:

<html>
<head>
<script type="text/javascript">

    currentPageObj = window.open("http://www.bbc.co.uk", "currentPage");

    currentPageObj.addEventListener("load", function(){alert("loaded")}, false);

</script>
</head>
<body>

    <form action="http://www.example.com" rel="nofollow" target="currentPage">
         <input type="submit">
    </form>

</body>
</html>