jquery如何实现点击按钮文本替换成输入框的内容?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jquery如何实现点击按钮文本替换成输入框的内容?相关的知识,希望对你有一定的参考价值。
<span class="tt">1111111111111111111111</span>
<div class="text">
<textarea name="textfield" id="textfield"> </textarea>
<input type="submit" name="button2" id="button2" value="提交" />
</div>
如上:
点击 提交 按钮
class为tt 里面 的内容替换成<textarea name="textfield" id="textfield"> </textarea> 文本框里面输入的内容
求高手帮我写出来。
如果将文本域的文本内容添加到span标签表示的区域中,可以使用如下代码
$("span").text($("textarea").val());下面举个例子:
创建html元素:span标签用于点击按钮后复制文本的区域,文本域用于文本的输入
<div class="top"><span></span>
<textarea></textarea><br>
<input type="button" value="提交">
</div>
简单设置一下css样式
div.topwidth:500px;height:150px;margin:50px;spandisplay: inline-block;width:330px;height:20px;padding:10px;margin:10px 0;border:2px dashed #ebbcbe;
textareawidth:350px;height:100px;padding:10px;border:1px solid green
input[type='button']width:80px;height:30px;margin:10px 0;
编写jquery代码
$(function()$("input[type='button']").click(function()
$("span").text($("textarea").val());
);
)
观察显示效果
初始状态
输入文字
点击按钮
如下代码可以解决:
$(document).ready(function()$("#button2").click(function()
$(".tt").html($("#textfield").val());
);
);本回答被提问者采纳 参考技术B $("#button2").click(function()$(".tt").html($("#extfield").val());return false;)
js实现点击内容到文本框再点击更换内容
各位大神,我想要一个类似于下拉框的单选效果,但是是横向的,也就是说有几个内容给点击,点击一个内容,文本框会显示相应内容,点击另一个内容,文本框会显示另一个内容,希望有完整代码
参考技术A 你可以参考下面的代码来进行:<!DOCTYPE HTML>
<html>
<head>
<title>yugi</title>
<meta charset=UTF-8 />
<style type="text/css">
</style>
<script type="text/javascript">
var LInserter =
start : 0,
end : 0,
isIE : function ()
return (!!window.ActiveXObject);
,
getPos : function (obj, whichone)
var me = LInserter;
var pos = 0;
var dir = whichone == "start" ? "StartToStart" : "StartToEnd";
if (me.isIE ())
var rangeSelection = document.selection.createRange ();
if (rangeSelection.parentElement ().id == obj.id)
if (obj.tagName.toLowerCase () == 'textarea')
var rangeBody = document.body.createTextRange ();
rangeBody.moveToElementText (obj);
else
var rangeBody = obj.createTextRange ();
for (pos = 0; rangeBody.compareEndPoints (dir, rangeSelection) < 0; pos++)
rangeBody.moveStart ("character", 1);
for ( var i = 0; i <= pos; i++)
if (obj.value.charAt (i) == "\n")
pos++;
return (pos = whichone == "start" ? (me.start = pos) : (me.end = pos));
else
return (pos = whichone == "start" ? (me.start = obj.selectionStart) : (me.end = obj.selectionEnd));
,
insert : function (obj, params)
var me = LInserter;
obj.value = obj.value.substring (0, me.start) + params + obj.value.substr (me.start);
return obj.value;
;
</script>
</head>
<body>
<a href="javascript:;" onclick="LInserter.insert(document.getElementById('conet'), '我我我我我我我我');">点我</a>
<a href="javascript:;" onclick="LInserter.insert(document.getElementById('conet'), '他他他他他他他');">点他</a>
<textarea name="conet" id="conet" rows="14" cols="50" style="resize:none;" onmouseup="LInserter.getPos(this, 'start');"></textarea>
</body>
</html>
以上是关于jquery如何实现点击按钮文本替换成输入框的内容?的主要内容,如果未能解决你的问题,请参考以下文章
网页 使用js或jQuery实现 显示的文本变成输入框以供修改