image in script wont work after correct answer

Question

I currently have a script which, if the answer is correct, spits out an image. If it is a good answer it will give out a green checkmark, and if it is wrong it will give out a red cross.
However it doesn't spit out the image, any ideas?

I have the idea that the "image="src= ../../../image/goed.png" is wrong and should be replaced, I have no idea what would be the right code.

function schrijvenles1(){
var text = document.getElementById("schrijven-les1").value;
var:text;

//het antwoord is correct
if(text="Ik heet Marie." || "ik heet Marie." || "ik heet marie" || "Ik heet marie") {
    image =" src=../../../image/goed.png";
}
// het antwoord is iets anders
else {
    image = src="src=../../../image/fout.png";
    document.getElementById("goed-fout") = image;

} }

this is the html code

        <p id ="goed-fout"> </p>
    <!-- geluidsfragment schrijfopdracht 1-->

    <button id="voortgang-button" onclick="playMusic1()" value="button">    
        <img id="afspeelbutton"   src ="../../../image/afspeelbutton1.png"> 

        <audio
            id="geluidsopname1" src="../../../voice-recording/marie.mp3">
        </audio>

        <input id="schrijven-les1" type="text" >  </input> 
    </button>
    <button 
        id="controle-luisteren" onclick="schrijvenles1()">Check
    </button>[enter image description here][1]

there is an image addeed to the page, which will give you a better idea of how the page looks and maybe give some better insights.

Do you get any errors (JS or HTTP) in your browser's dev tool's console? — Richard, Dec 01 '16 at 11:45
I dont get any error, it just doesn't do anything. it looks like it doesnt even submit it.. — dick doeven, Dec 01 '16 at 11:46

rafrcruz · Accepted Answer · 2016-12-01T16:18:12.890

1

when checking if the answer is correct, change this:

if(text="Ik heet Marie." || "ik heet Marie." || "ik heet marie" || "Ik heet marie")

to this:

if (text=="Ik heet Marie." || text == "ik heet Marie." || text == "ik heet marie" || text == "Ik heet marie")

Also, I did not understand you selecting a "p" element and setting a string to it. You should select a image element and change it's src property like this:

document.getElementById("imageid").src="../../../image/afspeelbutton1.png";

When you are sure your code is right and you suspect only of the image relative path, a good tip is to inspect your requests on the Network tab of your browser's development tools. So you will see the resulting absolute path your browser is requesting and so you can correct it.

Here is a working example: https://jsfiddle.net/5w80jfd0/

edited Dec 01 '16 at 16:18

answered Dec 01 '16 at 11:48

rafrcruz

117
7

if I use this, I want one picture to pop up when the answer is right and an other if its wrong. will i be able to do that with this? – dick doeven Dec 01 '16 at 11:58
Yes, sure. You just check the answer, and with the if block chage the element src to correct .png, or on the else block change the element src to the wrong .png – rafrcruz Dec 01 '16 at 12:07
Other way to do is to have both images (the image for correct aswer and wrong answer) on the the page. And you just change which one will show and which one will hide... here is a example hiding and showing elements http://stackoverflow.com/questions/6242976/javascript-hide-show-element – rafrcruz Dec 01 '16 at 12:10
im so sorry, but i can't figure out what you are talking about.. the image elements in my script are already the right image names (correct.png) etc.. – dick doeven Dec 01 '16 at 14:05

image in script wont work after correct answer

1 Answers1