How do I convert textarea to display something else(for example base64 decryption) with javascript?


I’m trying to create a decrypt page in HTML. I can get the input, and show it as output, but I am confused on how to change the text in the middle. Here is my code so far:


<textarea name="CipherText" id="CipherText" placeholder="Enter ciphertext here:"></textarea>
<div id="prevCom"></div>


wpcomment.onkeyup = wpcomment.onkeypress = function(){
    document.getElementById('prevCom').innerHTML = this.value;

// Define the string
var string = 'Hello World!';

// Encode the String
var encodedString = btoa(string);
console.log(encodedString); // Outputs: "SGVsbG8gV29ybGQh"

// Decode the String
var decodedString = atob(encodedString);
console.log(decodedString); // Outputs: "Hello World!"

I am getting the code from Base64 is just one example. What I want to know is how do I do the transition. In my JSFiddle on line 3 of the javascript is how I thought of implementing the conversion, but that doesn’t work.


I would do something like this:

const input = document.querySelector('#encoded-input')
const output = document.querySelector('#decoded-output')

input.oninput = e => {
  try {
    output.innerText = atob(
  } catch (error) {
    output.innerText =
      ? 'Please enter a valid Base64 encoded value.'
      : ''
<textarea id="encoded-input"></textarea>
<div id="decoded-output"></div>

Answered By – Eyal C

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published