![](https://iknow-base.cdn.bcebos.com/lxb/notice.png)
在javascript中如何实现单击按钮将文本框中输入的内容显示在页面上?
比如一个helloworld程序,在文本框输入内容之前,网页页面上内容为helloworld,在文本框输入“您好”时,单击按钮,显示内容则为”helloworld您好“,...
比如一个hello world程序,在文本框输入内容之前,网页页面上内容为hello world,在文本框输入“您好”时,单击按钮,显示内容则为”hello world 您好“,最好是纯静态web应用!
<script language="JavaScript">
function Display()
{
var name = $(".username").val();
$("h1").html("hello world" + name);
}
</script>
<input type="button" value="查看" onclick="Display()"><br/>
<h1></h1>
<br/>
<div id="ad_wordle_01" class="public_ad"></div>
<h3 class="tp09 pt10 tp05"></h3>
<h3 class="tp09 tp05 pb10"></h3>
<p class="tp03 qw03 tp05 sumry"></p>
改下这里面的内容就行! 展开
<script language="JavaScript">
function Display()
{
var name = $(".username").val();
$("h1").html("hello world" + name);
}
</script>
<input type="button" value="查看" onclick="Display()"><br/>
<h1></h1>
<br/>
<div id="ad_wordle_01" class="public_ad"></div>
<h3 class="tp09 pt10 tp05"></h3>
<h3 class="tp09 tp05 pb10"></h3>
<p class="tp03 qw03 tp05 sumry"></p>
改下这里面的内容就行! 展开
4个回答
展开全部
文本框内容显示在指定地方:就是一个dom内容转移的操作,使用Jquery获取原生js都很好实现,配合具体js事件实现。具体操作如下:
//假定文本框的id='mytext',指定显示区域的id='show'
//div/span/p等节点,不是文本元素
function fun(){
getEle('show').innerHTML =getEle('mytext').value;
}
function getEle(id){
return document.getElementById(id);
}
<!--button click 触发-->
<input type='text' id='mytext'/>
<input type='button' onclick='fun();' value="button"/>
<!--input onblur 触发-->
<input type='text' id='mytext' onblur="fun();"/>
展开全部
<script>
function show(){
var show = document.getElementById("showContent");//显示文本的对象
var content = document.getElementById("content");//输入文字的对象
show.innerHTML += content.value;//把两个相连接
}
</script>
<h1 id="showContent">Hello World!</h1>
<input id="content" name="content"/>
<button onClick="show()">把内容加载在页面上</button>
追问
你会错意思了,不是把每次结果相加,而是每次查询的结果都是一对一的!
追答
//那就把加号去掉就行了
show.innerHTML = content.value;
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<!doctype html>
<html>
<head>
<meta charset="utf-8">
</head>
<script type="text/javascript">
window.onload = function(){
var submit = document.getElementById("submit");
var text = document.getElementById('in');
var target = document.getElementById('target');
submit.onclick = function(e){
if(text.value !=""){
target.textContent = text.value;
}
};
};
</script>
<body>
<input type='text' id="in" /> <input type='button' id="submit" value="提交"/><br/>
<span style="color:red">hello world</span><span id="target" style="color:green;padding-left:10px;"></span>
</body>
</html>
更多追问追答
追问
为空的时候结果不会清除,即前一次结果被保留!
追答
现在就是这样的哦。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<input type=text id="hd" name="hd" value="hello world">
<input type=text id="nh" name="nh" value="您好">
<input type = "button" value="替换按钮" onclick="changeName();"/>
<javascript>
function changeName(){
var changeVal = document.getElementById("nh").value;
var hdVal = document.getElementById("nh").value;
document.getElementById("hd").value = hdVal+changeVal;
}
</javascript>
<input type=text id="nh" name="nh" value="您好">
<input type = "button" value="替换按钮" onclick="changeName();"/>
<javascript>
function changeName(){
var changeVal = document.getElementById("nh").value;
var hdVal = document.getElementById("nh").value;
document.getElementById("hd").value = hdVal+changeVal;
}
</javascript>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询