LinuxQuestions.org - [SOLVED] Need Help with Java Script

- Programming (https://www.linuxquestions.org/questions/programming-9/)

- - Need Help with Java Script (https://www.linuxquestions.org/questions/programming-9/need-help-with-java-script-4175431229/)

Need Help with Java Script

Posted this on Newbie but was told to post it here...Why is my swapFE not working?

Code:

 addEvent (window, "load", setUp, false);



function addEvent(object, evName, fnName, cap) {

  if (object.attachEvent)

      object.attachEvent("on" + evName, fnName);

  else if (object.addEventListener)

      object.addEventListener(evName, fnName, cap);

}

function setUp() {

    var transDoc = document.getElementById("doc");

        var olElem = document.createElement("ol");

                for (var i = 0; i < french.length; i++){

        var newLI = document.createElement("li");

                newLI.innerHTML = french[i];

                newLI.id = i + "phrase"; 

                newLI.style.cursor = "pointer";

                addEvent(newLI, "onmousedown", swapFE, false);

                addEvent(newLI, "onmouseup", swapEF, false);

                olElem.appendChild (newLI);

                }

                transDoc.appendChild(olElem);

 }

function swapFE(e) {

        var phrase = event.target || event.srcElement;

                if (phrase.nodeName == "#text")

                phrase = phrase.parentNode;

                

        var phraseNum = parseInt(phrase.id);

                phrase.innerHTML = english[phraseNum];

                phrase.style.color = "rgb(155,102,102)";

                phrase.style.fontstyle = "italic";

}

function swapEF(e) {

        var phrase = event.target || event.srcElement;

                if (phrase.nodeName == "#text")

                phrase = phrase.parentNode;

 

        var phraseNum = parseInt(phrase.id);

                phrase.innerHTML = french[phraseNum];

                phrase.style.color = "rgb(0,0,0)";

                phrase.style.fontstyle = "normal";

}

This is the HTML it's linked to...

Code:

 <div id = "doc">

        <h1>Week 5 Phrases</h1>

        <h2>Press down your mouse button on each phrase to translate</h2>



      </div>

      <address>

        French-English Translation Page

      </address>

  </div>

Quote:

function swapFE(e) {
var phrase = event.target || event.srcElement;

Are event and e supposed to have the same name?

I wish I knew I've been working on this for 12 hours now....It's in the swapFE and swapEF functions but all my research is turning up with nothing...I'll be glad to be done with HTML!

I am quite sure that this will fix the specific problem you've been encountering:

Code:

function swapFE(event) {

        var phrase = event.target || event.srcElement;

                if (phrase.nodeName == "#text")

                phrase = phrase.parentNode;

                

        var phraseNum = parseInt(phrase.id);

                phrase.innerHTML = english[phraseNum];

                phrase.style.color = "rgb(155,102,102)";

                phrase.style.fontstyle = "italic";

}

function swapEF(event) {

        var phrase = event.target || event.srcElement;

                if (phrase.nodeName == "#text")

                phrase = phrase.parentNode;

 

        var phraseNum = parseInt(phrase.id);

                phrase.innerHTML = french[phraseNum];

                phrase.style.color = "rgb(0,0,0)";

                phrase.style.fontstyle = "normal";

}

It still doesn't do the onmousedown function :(

this file is going to make me go even more bald! The text in the "doc" doesn't change from french to english.

Another Java file

Here is the file it is supposed to swap....

Code:

var english=new Array();

english[0]="This hotel isn't far from the Eiffel Tower.";

english[1]="What time does the train arrive?";

english[2]="We have been waiting for the bus for one half-hour.";

english[3]="This meal is delicious";

english[4]="What day is she going to arrive?";

english[5]="We have eleven minutes before the train leaves!";

english[6]="Living in a foreign country is a good experience.";

english[7]="Excuse me! I'm late!";

english[8]="Is this taxi free?";

english[9]="Be careful when you go down the steps.";



var french=new Array();

french[0]="Cet hôtel n'est pas loin de la Tour Eiffel.";

french[1]="A quelle heure arrive le train?";

french[2]="Nous attendons l'autobus depuis une demi-heure.";

french[3]="Ce repas est délicieux";

french[4]="Quel jour va-t-elle arriver?";

french[5]="Nous avons onze minutes avant le départ du train!";

french[6]="Habiter dans un pays étranger est une bonne expérience.";

french[7]="Excusez-moi! Je suis en retard!";

french[8]="Est-ce que ce taxi est libre?";

french[9]="Faites attention quand vous descendez l'escalier.";

Just Curious....

Why are my Emails different from what you post? You had value-added information on the email that didn't show up on the post...???

Uhm, what? I didn't email you. (At least not that I'm aware of!) I did edit my post after posting it. Here's what I removed, because I didn't think it was needed:

Quote:

Well, here's what I see.

You pass in an "e" parameter and never refer to it.

You immediately refer to "event" parameters which come out of nowhere.

"event" and "e" are both common names for the arguments passed to event handlers.

Emails are set to Auto

The emails I get on posts are set to auto..I help a lot of people on the newbie forum so I need to know when they reply.

If you want to continue this, btw, you're going to need to post the entire Javascript and HTML files. The excerpts aren't enough for me to reproduce the problem.

This should be everything...Your supposed to be able to click the french and it automatically translates to english....

Code:

 <?xml version="1.0" encoding="UTF-8" ?>



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">



<html xmlns="http://www.w3.org/1999/xhtml">

<head>

 <title>French Phrases Week 5</title>

  <link href="styles.css" rel="stylesheet" type="text/css" />

  <script src="engfr.js" type="text/javascript"></script>

  <script src="french5.js" type="text/javascript"></script>





</head>



<body>

  <div id = "page">

      <div id="head">

        <div id = "rightHead">

            <b>Prof. Eve Granger</b><br />

            Office: 810 Linton Hall<br />

            Hours: TR: 3:00-4:30

        </div>

        <div id = "leftHead">

            <b>French 101</b><br />

            MWF: 9:00-9:50<br />

            Rm. 402 Linton Hall

        </div>

      </div>



      <ul id="links">

        <li class="newgroup"><a href="#">Home</a></li>

        <li class="newgroup"><a href="#">Phrases</a></li>

        <li><a href="#">Week 1 Phrases</a></li>

        <li><a href="#">Week 2 Phrases</a></li>

        <li><a href="#">Week 3 Phrases</a></li>

        <li><a href="#">Week 4 Phrases</a></li>

        <li><a href="#">Week 5 Phrases</a></li>

        <li class="newgroup"><a href="#">Quizzes</a></li>

        <li><a href="#">Chapter 1 Quiz</a></li>

        <li><a href="#">Chapter 2 Quiz</a></li>

        <li><a href="#">Chapter 3 Quiz</a></li>

        <li class="newgroup"><a href="#">Dept. of French</a></li>

        <li><a href="#">French 101</a></li>

        <li><a href="#">French 135</a></li>  

        <li><a href="#">French 155</a></li>  

        <li><a href="#">French 201</a></li>  

        <li><a href="#">French 301</a></li>  

        <li class="newgroup"><a href="#">Staff</a></li>

        <li><a href="#">Denise Abbot</a></li>

        <li><a href="#">Viola Devreaux</a></li>

        <li><a href="#">Eve Granger</a></li>

        <li><a href="#">Cynthia Trudeau</a></li>

        <li><a href="#">Gary Vironque</a></li>

      </ul>



      <div id = "doc">

        <h1>Week 5 Phrases</h1>

        <h2>Press down your mouse button on each phrase to translate</h2>



      </div>

      <address>

        French-English Translation Page

      </address>

  </div>



</body>



</html>

Code:

 addEvent (window, "load", setUp, false);



function addEvent(object, evName, fnName, cap) {

  if (object.attachEvent)

      object.attachEvent("on" + evName, fnName);

  else if (object.addEventListener)

      object.addEventListener(evName, fnName, cap);

}

function setUp() {

    var transDoc = document.getElementById("doc");

        var olElem = document.createElement("ol");

                for (var i = 0; i < french.length; i++){

        var newLI = document.createElement("li");

                newLI.innerHTML = french[i];

                newLI.id = i + "phrase"; 

                newLI.style.cursor = "pointer";

                addEvent(newLI, "onmousedown", swapFE, false);

                addEvent(newLI, "onmouseup", swapEF, false);

                olElem.appendChild (newLI);

                }

                transDoc.appendChild(olElem);

 }

function swapFE(event) {

        var phrase = event.target || event.srcElement;

                if (phrase.nodeName == "#text")

                phrase = phrase.parentNode;

                

        var phraseNum = parseInt(phrase.id);

                phrase.innerHTML = english[phraseNum];

                phrase.style.color = "rgb(155,102,102)";

                phrase.style.fontstyle = "italic";

}

function swapEF(event) {

        var phrase = event.target || event.srcElement;

                if (phrase.nodeName == "#text")

                phrase = phrase.parentNode;

 

        var phraseNum = parseInt(phrase.id);

                phrase.innerHTML = french[phraseNum];

                phrase.style.color = "rgb(0,0,0)";

                phrase.style.fontstyle = "normal";

}

Code:

var english=new Array();

english[0]="This hotel isn't far from the Eiffel Tower.";

english[1]="What time does the train arrive?";

english[2]="We have been waiting for the bus for one half-hour.";

english[3]="This meal is delicious";

english[4]="What day is she going to arrive?";

english[5]="We have eleven minutes before the train leaves!";

english[6]="Living in a foreign country is a good experience.";

english[7]="Excuse me! I'm late!";

english[8]="Is this taxi free?";

english[9]="Be careful when you go down the steps.";



var french=new Array();

french[0]="Cet hôtel n'est pas loin de la Tour Eiffel.";

french[1]="A quelle heure arrive le train?";

french[2]="Nous attendons l'autobus depuis une demi-heure.";

french[3]="Ce repas est délicieux";

french[4]="Quel jour va-t-elle arriver?";

french[5]="Nous avons onze minutes avant le départ du train!";

french[6]="Habiter dans un pays étranger est une bonne expérience.";

french[7]="Excusez-moi! Je suis en retard!";

french[8]="Est-ce que ce taxi est libre?";

french[9]="Faites attention quand vous descendez l'escalier.";

1st file is HTM, second is engfr.js, and third is french5.js style sheet is a nonplayer...

I don't see how that could possibly be everything when the first code block starts with an indented line. Please use pastebin if the forum is mangling it.

Trying file upload...

I'm trying to upload entire files...It won't let me... hang on!

Gotta do them 1 at a time!

Code:

<?xml version="1.0" encoding="UTF-8" ?>



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">



<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<!-- 

  

  

  Filename:        french5.htm

  Supporting files: engfr.js, french.js, styles.css



-->

  <title>French Phrases Week 5</title>

  <link href="styles.css" rel="stylesheet" type="text/css" />

  <script src="engfr.js" type="text/javascript"></script>

  <script src="french5.js" type="text/javascript"></script>





</head>



<body>

  <div id = "page">

      <div id="head">

        <div id = "rightHead">

            <b>Prof. Eve Granger</b><br />

            Office: 810 Linton Hall<br />

            Hours: TR: 3:00-4:30

        </div>

        <div id = "leftHead">

            <b>French 101</b><br />

            MWF: 9:00-9:50<br />

            Rm. 402 Linton Hall

        </div>

      </div>



      <ul id="links">

        <li class="newgroup"><a href="#">Home</a></li>

        <li class="newgroup"><a href="#">Phrases</a></li>

        <li><a href="#">Week 1 Phrases</a></li>

        <li><a href="#">Week 2 Phrases</a></li>

        <li><a href="#">Week 3 Phrases</a></li>

        <li><a href="#">Week 4 Phrases</a></li>

        <li><a href="#">Week 5 Phrases</a></li>

        <li class="newgroup"><a href="#">Quizzes</a></li>

        <li><a href="#">Chapter 1 Quiz</a></li>

        <li><a href="#">Chapter 2 Quiz</a></li>

        <li><a href="#">Chapter 3 Quiz</a></li>

        <li class="newgroup"><a href="#">Dept. of French</a></li>

        <li><a href="#">French 101</a></li>

        <li><a href="#">French 135</a></li>  

        <li><a href="#">French 155</a></li>  

        <li><a href="#">French 201</a></li>  

        <li><a href="#">French 301</a></li>  

        <li class="newgroup"><a href="#">Staff</a></li>

        <li><a href="#">Denise Abbot</a></li>

        <li><a href="#">Viola Devreaux</a></li>

        <li><a href="#">Eve Granger</a></li>

        <li><a href="#">Cynthia Trudeau</a></li>

        <li><a href="#">Gary Vironque</a></li>

      </ul>



      <div id = "doc">

        <h1>Week 5 Phrases</h1>

        <h2>Press down your mouse button on each phrase to translate</h2>



      </div>

      <address>

        French-English Translation Page

      </address>

  </div>



</body>



</html>