SemicolonExpected
SemicolonExpected

Reputation: 614

Uncaught ReferenceError : Invalid left-hand side in assignment

I'm trying to make a survey, and with each click, assign a variable a certain phrase. Then display it in the div when I click span#display . I get the "Uncaught ReferenceError: Invalid left-hand side in assignment" when I run this code:

var a = "none chosen";
function companyPicka()
            {
                a= "I love Valve";
            } 
            function companyPickb()
            {
                a= "I love Bethesda";
            } 
            function companyPickc()
            {
                a= "I love EA";
            } 
            function companyPickd()
            {
                a= "I love Ubisoft";
            } 
            function companyPicke()
            {
                a= "I play terrible NES, SNES games";
            } 
            function companyPickf()
            {
                a= "I like something that's so underground I wouldn't expect  you to know it";
            }
function display()
            {
                document.getElementById("display") = "a+''+b+''+c+''+d+''+e+''+f+''+g+''+h";
            }


<div>
                <span onclick="companyPicka(); this.style.border='inset';">
                Valve &#60;3</span> 
                <span onclick="companyPickb(); this.style.border='inset';"> 
                Bethesda :\ </span>
                <span onclick="companyPickc(); this.style.border='inset';">
                EA </span>
                <span onclick="companyPickd(); this.style.border='inset';"> 
                Ubisoft </span>
                <span onclick="companyPicke(); this.style.border='inset';">
                LJN</span>
                <span onclick="companyPickf(); this.style.border='inset';">
                Other</span>
            </div>

<span onclick="display();"> See Results </span>
            <div id="display">
            </div>

Upvotes: 1

Views: 10739

Answers (2)

nnnnnn
nnnnnn

Reputation: 150050

The following line is wrong:

document.getElementById("display") = "a+''+b+''+c+''+d+''+e+''+f+''+g+''+h";

You can't assign a string directly to an HTML element. One way to set the element's content is with .innerHTML:

document.getElementById("display").innerHTML = "something";

Note also that the right-hand side of your expression is a string containing the actual text a+''+b+''+c+''+d+''+e+''+f+''+g+''+h - that is, the character "a" then the character "+", then two apostrophes, etc. It is not an expression concatenating the variables a, b, c, etc. (not that your code as shown has variables for b, c, d, etc). If you remove the surrounding double-quotes it would be an expression concatenating the variables.

Having a different function for every option is a very messy way to code this type of thing. You may like to try something like the following (could be further tidied, but I don't want to overload you with too much information all at once):

var phrases = {
      a : "I love Valve",
      b : "I love Bethesda",
      c : "I love EA",
      d : "I love Ubisoft",
      e : "I play terrible NES, SNES games",
      f : "I like something that's so underground I wouldn't expect  you to know it"
    },
    currentPhrase = "none selected";

function companyPick(which) {
   currentPhrase = phrases[which] || "none selected";
}

function display() {
   document.getElementById("display").innerHTML = currentPhrase;
}

<div>
  <span onclick="companyPick('a'); this.style.border='inset';">
  Valve &#60;3</span> 
  <span onclick="companyPick('b'); this.style.border='inset';"> 
  Bethesda :\ </span>
  <span onclick="companyPick('c'); this.style.border='inset';">
  EA </span>
  <span onclick="companyPick('d'); this.style.border='inset';"> 
  Ubisoft </span>
  <span onclick="companyPick('e'); this.style.border='inset';">
  LJN</span>
  <span onclick="companyPick('f'); this.style.border='inset';">
  Other</span>
</div>

<span onclick="display();"> See Results </span>
<div id="display"></div>

Upvotes: 4

noob
noob

Reputation: 9202

This line is incorrect:

document.getElementById("display") = "a+''+b+''+c+''+d+''+e+''+f+''+g+''+h";

use this:

document.getElementById("display").innerHTML = a+''+b+''+c+''+d+''+e+''+f+''+g+''+h;

Edit:

Actually this makes no scene: a+''+b+''+c+''+d+''+e+''+f+''+g+''+h

It is the same like this: a+b+c+d+e+f+g+h

Upvotes: 3

Related Questions