[英]converting input type text to plain text
i'm working on a small html form with 1 textbox input, after the user enters any text and he presses a button on the end of the page i want the to change to a normal plain html text(so the whole page can be copy pasted into a word file including the written down text in the textbox). 我正在处理一个带有1个文本框输入的小html表单,在用户输入任何文本后他按下页面末尾的按钮我希望将其更改为普通的普通html文本(因此整个页面可以复制粘贴到word文件中,包括文本框中记下的文本)。
as an example: 举个例子:
<input type="text" id="fileserver">
<button onclick="disable_all();">click!</button>
after the button is pressed i want the textbox to be converted to plain html text with no more textbox like this: 按下按钮后,我希望文本框转换为普通的html文本,不再有这样的文本框:
click! 点击!
i have been searching around and have not found a working solution yet, hope someone can help me out 我一直在寻找并且尚未找到可行的解决方案,希望有人可以帮助我
$('button').click(function(){
$('body *').replaceWith(function(){
return this.value || this.innerHTML;
});
});
This should do it I think. 我认为应该这样做。
function disable_all() {
var fs = $("#fileserver"), span = $( "<span>" + fs.val() + "</span>");
span.insertAfter(fs);
fs.remove(); // or fs.hide(); in case you want it later.
}
This should be helpful to you - 这应该对你有所帮助 -
There are several way to achieve your task : 有几种方法可以完成您的任务:
Solutions 1 - 解决方案1 -
function disable_all()
{
$('#content').remove();
$('#fileserver, button').hide();
$('body').append("<div id='content'>" + $('#fileserver').val() + "</div>")
}
Solution 2 - 解决方案2 -
function disable_all()
{
$("body").html($("#fileserver").val());
}
you can do this hiding the textbox 你可以隐藏文本框
<input type="text" id="fileserver">
<div id="result"></div>
<button id="btn" >click!</button>
and 和
$(document).ready(function(){
$("#result").hide();
$("#btn").click(function(){
$("#result").text($("#fileserver").val());
$("#fileserver").hide();
$("#result").show();
});
});
The first "non-jQuery" answer... 第一个“非jQuery”答案......
your HTML: 你的HTML:
<input type="text" id="fileserver">
<div style="display: none;" id="fileserver_text"></div>
<button id="btn">click!</button>
your Javascript: 你的Javascript:
document.getElementById('btn').onclick = disable_all;
function disable_all() {
var input = document.getElementById('fileserver');
var disp = document.getElementById('fileserver_text')
disp.innerHTML = input.value; // get the text from the input and set the div text
disp.style.display = 'block'; // show the div
input.style.display = 'none'; // hide the input
}
If you are using jQUery, this will help you, http://jsfiddle.net/DCak6/ 如果您使用的是jquery,这将对您有帮助, http://jsfiddle.net/DCak6/
function save(){
$('input,textarea').each(function(){
var $this = $(this);
$this.after('<span class="value">' + $this.val() + '</span>');
$this.remove();
})
}
You may be better off with taking the text from the text field, copying the value and putting it into another div 从文本字段中取出文本,复制值并将其放入另一个div可能会更好
<div id="textToCopy"></div>
<input type="text" id="fileserver">
<button onclick="disable_all();">click!</button>
<script type="text/javascript">
function disable_all() {
$('#textToCopy').html($('#fileserver').val());
$('#fileserver').hide();
}
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.