Question

我有一个根据用户选择生成表单的页面。我想知道是否有办法将表单转换为纯文本？防爆。表单有4个字段，每个字段都有一个标签。我想获取所有标签/字段并将其打印给用户，如下所示：

label1 field1
label2 field2
label3 field3
label4 field4

有办法吗？

Answer 1

您可以使用jQuery生成基本输出，例如：

var texts = [];
$("form label").each(function() {
    var oLabel = $(this);
    var oInput = oLabel.next();
    texts.push(oLabel.text() + " - " + oInput.val());
});
var plainText = texts.join("<br />");
$("#Output").html(plainText);

这将迭代所有表单标签，然后获取每个标签的下一个元素作为输入。

Live test case

Answer 2

如果您不介意额外的文件，请使用PHP。

你需要创建一个小的php文件来回显所有的表单信息：

<?php
$label1 = "label1";
$label2 = "label2"; //Set all labels here
$label3 = "label3";
$label4 = "label4";
echo $label1 . " " . $_POST['field1'] . "<br />"; //Change to get depending on your method.
echo $label2 . " " . $_POST['field2'] . "<br />";
echo $label3 . " " . $_POST['field3'] . "<br />";
echo $label4 . " " . $_POST['field4'] . "<br />";
echo "Done.";
?>

并将其放入自己的文件中。将表单的action属性设置为该文件，它将打印出所有数据。

Answer 3

没有JavaSCript库的一种方法是：

var form = document.getElementsByTagName('form')[0];

form.onsubmit = function(){

    var labels = document.getElementsByTagName('label');

    if (!document.getElementById('container')){
        var container = document.createElement('ol');
        container.id = 'container';
    }
    else {
        var container = document.getElementById('container');
        while (container.firstChild){
            container.removeChild(container.firstChild);
        }
    }

    for (var i=0,len=labels.length; i<len; i++){
        if(document.getElementById(labels[i].getAttribute('for'))){
            var newLi = document.createElement('li');
            var iText = document.createElement('span');
            newLi.innerHTML = labels[i].innerHTML;
            iText.innerHTML = document.getElementById(labels[i].getAttribute('for')).value;
            newLi.appendChild(iText);
            container.appendChild(newLi);
        }
    }

    document.getElementsByTagName('body')[0].appendChild(container);

    return false;

};

JS Fiddle demo

参考文献：

Answer 4

您可以使用

获取javascript中标签和字段的值

var label1 = getElementById("id").name

创建一个格式化的字符串，以便显示用户并使用

显示所有值

document.write(string);

将表单转换为纯文本

4 个答案: