Reputation: 51
So I am trying to make a simple translator. I am just having some issues with it. For example, I want it to register the letter B and then it will write bob. Now when I write b in the translate to box (which is the normal variable) it says in the translated to box (which is theifTalk) [object HTMLTextAreaElement]bob. And in the console it says: Cannot read property 'repeat' of undefined. Anyways here's my code:
const theifTalk = document.getElementById('theiftalk');
const normal = document.getElementById('normal');
const translateBtn = document.getElementById('translateBtn');
translateBtn.onclick = function() {
theifTalk.value = "";
translate();
}
function translate() {
if (normal.value.includes("b")) {
var bCount = normal.value.match(/b/g)||[].length;
b().repeat(bCount.length);
}
}
function b() {
theifTalk.value = theifTalk + "bob";
}
HTML CODE:
<textarea type="text" id="normal" rows="15" cols="80" placeholder="Normal text goes in here..."></textarea>
<textarea type="text" id="theiftalk" rows="15" cols="80" placeholder="Theif Talk text goes out here..."></textarea>
<br>
<button id="translateBtn">translate</button>
Upvotes: 0
Views: 290
Reputation: 68933
As you are not returning anything from function explicitly undefined
is returned. You have return the value from function. Also, theifTalk
is the element itself, you should take the value from that:
function b() {
theifTalk.value = theifTalk.value + "bob";
return theifTalk.value;
}
You also should set the value back to the theifTalk
:
theifTalk.value = b().repeat(bCount.length);
const theifTalk = document.getElementById('theiftalk');
const normal = document.getElementById('normal');
const translateBtn = document.getElementById('translateBtn');
translateBtn.onclick = function() {
translate();
}
function translate() {
if (normal.value.includes("b")) {
var bCount = normal.value.match(/b/g)||[].length;
theifTalk.value = b().repeat(bCount.length);
}
}
function b() {
theifTalk.value = theifTalk.value + "bob";
return theifTalk.value;
}
<textarea type="text" id="normal" rows="15" cols="80" placeholder="Normal text goes in here..."></textarea>
<textarea type="text" id="theiftalk" rows="15" cols="80" placeholder="Theif Talk text goes out here..."></textarea>
<br>
<button id="translateBtn">translate</button>
Upvotes: 1