按钮单击时无法从文本框中显示文本?

时间:2015-11-23 08:19:05

标签: javascript html

我使用html创建了button(click on me)。单击该按钮后,屏幕上会显示textbox和另一个button(show)。单击显示按钮时会显示textbox中写入的值。隐藏了textbox和显示按钮。再次当我click (click on me ) button显示textbox和显示按钮时。但是当我在textbox中写入文本并单击显示按钮时,此时文本将不会显示。这意味着第一次显示文本但不会显示。我想重复显示文字。我是javascript的新手,所以请帮助我。我还想将显示的文本拖放到屏幕上的任何位置。

Try.html

<html>
<head>
</head>
<body>


<form name="frm">

<input type="button" value="Click on Me" id="button" onClick="display();">
</form>

<div id="responce"></div>

<script language="javascript" type="text/javascript">

var box="textBox"

function display()
{
document.getElementById('responce').innerHTML+='<center><input type="text" id="'+box+'" /></center>';
document.getElementById('responce').innerHTML+='<center><INPUT type="button" value="Show" id="btn2" onClick="visual();"/></center>';
}
</script>

<script>
function visual()
{   

var dis=document.getElementById(box).value ;
document.getElementById('responce').innerHTML+=document.getElementById(box).id;;
document.getElementById('responce').innerHTML+='<br><center>nilav '+dis+'</center></br>';
document.getElementById(box).style.visibility='hidden';
document.getElementById('btn2').style.visibility='hidden';


}
</script>

</script>
</body>

</html>

1 个答案:

答案 0 :(得分:3)

在显示功能中,您将创建文本框&amp;按钮每次调用该函数时,我只是添加了一个检查对象是否已经存在的信息,它只会改变可见性。

<html>
<head>
</head>
<body>


<form name="frm">

<input type="button" value="Click on Me" id="button" onClick="display();">
</form>

<div id="responce"></div>

<script language="javascript" type="text/javascript">

var box="textBox"

function display()
{
    if(!document.getElementById(box)) {
        document.getElementById('responce').innerHTML+='<center><input type="text" id="'+box+'" /></center>';
        document.getElementById('responce').innerHTML+='<center><INPUT type="button" value="Show" id="btn2" onClick="visual();"/></center>';
    }
    else {
        document.getElementById(box).style.visibility='visible';
        document.getElementById('btn2').style.visibility='visible';
    }
}
</script>

<script>
function visual()
{   

var dis=document.getElementById(box).value ;
document.getElementById('responce').innerHTML+=document.getElementById(box).id;;
document.getElementById('responce').innerHTML+='<br><center>nilav '+dis+'</center></br>';
document.getElementById(box).style.visibility='hidden';
document.getElementById('btn2').style.visibility='hidden';


}
</script>

</body>

</html>