JavaScript: textarea not showing output

Question

I am making a Leetspeak converter program, but the second textarea does not show any output. Here is my rudimentary code:

    <!DOCTYPE html>
    <html>
    <body>

    <h1>Leetspeak Converter</h1>

    <script language="JavaScript">
    function convert(){
      var x = document.getElementById("myTextArea").value;
      var result='';
      for (var i = 0, len = x.length; i < len; i++) {
        if (x.charAt(i)=='A'){
          result = result + '4';
        }
      }
      document.getElementById('resultTextarea').value = result ;
    }
    </script>

    <div class="input">
    <textarea id = "myTextArea" rows = "6" cols = "80">
    </textarea>
    </div>

    <div class="push">
    <button onclick="convert">Convert</button>
    </div>

    <div class="result">
    <textarea id = "resultTextArea" rows = "6" cols = "80">
    </textarea>
    </div>

It does not produce any output at all. I have tried using console.log(), but it shows no output. I have also used a debugger, but no dice.

score 2 · Accepted Answer · 2017-12-10 11:43:16Z

2

You have syntax errors, in 2 parts, so change this

<button onclick="convert">Convert</button> // this does not represent a method

with this

<button onclick="convert()">Convert</button>

and in addition, this

document.getElementById('resultTextarea').value = result ; // a small typo in id

with this

document.getElementById('resultTextArea').value = result ;

function convert(){
      var x = document.getElementById("myTextArea").value;
      var result=0;
      for (var i = 0, len = x.length; i < len; i++) {
        if (x.charAt(i)=='A'){
          result = result + 4;
        }
      }
      document.getElementById('resultTextArea').value = result ;
    }

<div class="input">
    <textarea id = "myTextArea" rows = "6" cols = "80">
    </textarea>
    </div>

    <div class="push">
    <button onclick="convert()">Convert</button>
    </div>

    <div class="result">
    <textarea id = "resultTextArea" rows = "6" cols = "80">
    </textarea>
    </div>

edited Dec 10, 2017 at 11:43

answered Dec 10, 2017 at 11:40

user2560539

Sign up to request clarification or add additional context in comments.

3 Comments

toyotasupra Over a year ago

Thank you a lot. Can you point out what errors I made, so I can avoid them in the future. I am new.

user2560539 Over a year ago

@toyotasupra minor issues that could happen if you work late and your eyes are tired :)

toyotasupra Over a year ago

Yes, I am only 13 but code like hell, all the time, so I have been in that situation tons of times.

Akshay Pethani · Accepted Answer · 2017-12-10 11:42:35Z

1

You have syntax error in:

<button onclick="convert">Convert</button>

Fixed this as:

<button onclick="convert()">Convert</button>

answered Dec 10, 2017 at 11:42

Akshay Pethani

2,6402 gold badges32 silver badges44 bronze badges

Comments

F.Kahalaj · Accepted Answer · 2017-12-10 12:07:36Z

try this

<!DOCTYPE html>
    <html>
    <body>

    <h1>Leetspeak Converter</h1>

    <script language="JavaScript">
    function convert(){
      var x = document.getElementById("myTextArea").value;

      var result='';


      for (var i = 0,len = x.length ; i < len; i++) {
        if (x.charAt(i)=='A'){
          result = result + '4';
        }
      }

      document.getElementById('resultTextArea').value = result ;
    }
    </script>

    <div class="input">
    <textarea id = "myTextArea" rows = "6" cols = "80">
    </textarea>
    </div>

    <div class="push">
    <button onclick="convert()">Convert</button>
    </div>

    <div class="result">
    <textarea id = "resultTextArea" rows = "6" cols = "80">
    </textarea>
    </div>
    </body>
    </html>

Collectives™ on Stack Overflow

JavaScript: textarea not showing output

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related