keist99 keist99 - 1 month ago 9
HTML Question

Emptyness check and change visibility

This is my html:

<textarea name="content" rows="10"></textarea>


And this is my js.

function popup() {
var textArea=document.getElementsByName('content');
var popupArea=document.getElementsByClass('popup');
if (textArea[0].value=="") {
window.alert("Input");
}
else {
popupArea[0].innerHTML=textArea[0].value;
popupArea[0].style.display="block";
}
}


What I want is to make "popup" class contain the text from textarea and be visible, except for textarea is empty: I want to make an alert if it is empty.

It does not work, please help.. As this is a kind of assignment, please avoid suggesting jQuery.

XYZ XYZ
Answer Source

Change getElementsByClass to getElementsByClassName

function popup() {
    var textArea=document.getElementsByName('content');
    var popupArea=document.getElementsByClassName('popup');
    if (textArea[0].value=="") {
        window.alert("Input");
    }
    else {
        popupArea[0].innerHTML=textArea[0].value;
        popupArea[0].style.display="block";
    }
}

popup();
<textarea name="content" rows="10"></textarea>
 <div class="popup"></div>