javascript - 使 HTML 输入字段仅显示为字段中的文本

Question

我有一个带有许多input字段的 HTML 表单，这些字段使用 jQuery 在每个字段中动态添加内容。

是否可以隐藏这些字段是输入字段并仅将它们显示为字段中的内容的事实？

我不想隐藏整个字段及其内容 --- 只是隐藏它是一个输入类型字段的事实。

我试过 jQuery 的hide()and $('#foo').css('display','none')，但这隐藏了整个字段。

这个想法是可能有大量字段，但我不希望用户看到所有输入文本字段。

Answer 1

从这样的事情开始：

input {
    border: none;
    outline: none;
    background-color: transparent;
    font-family: inherit;
    font-size: inherit;
}

Answer 2

像这样的东西怎么样：

$('.dynamic input').each(function() {
    $('<div/>').html($(this).val()).insertAfter($(this).hide());
});

Answer 3

使用 cssborder:none;属性并确保框足够长/高。