JS输入框比较多？答案

【问题标题】：JS Input box more of them?JS输入框比较多？
【发布时间】：2010-02-06 21:53:12
【问题描述】：

我有一个 profile.php，社区中的每个用户都有他们的个人资料。现在我想在编辑之外做一些聪明的事情，所以我希望这样做，当你点击一个字段时，它会变成一个输入，然后你可以编辑它这个字段..（例如：www.azzyh.dk，点击“点击我”）无论如何，

我已经知道该怎么做，这是一个脚本：

<script language="JavaScript">
function createObject() {  
var request_type;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
request_type = new ActiveXObject("Microsoft.XMLHTTP");
}else{
request_type = new XMLHttpRequest();
}
return request_type;
}

var http = createObject();
function myEditable(e, act) {
    if (act == 'click') {
        // lav indholdet af span om til et input felt og sæt et onblue event på den
        e.innerHTML = '<input type="text" value="'+e.innerHTML+'" onblur="myEditable(this, \'edit\')" />';

        // fjern span onclick eventen
        e.onclick = null;

    } else if (act == 'edit') {
    var nocache = 0;
        // hent span elementet igen
        var parentElement = e.parentNode;

        // Opdater span teksten, e.value er den nye værdi
        parentElement.innerHTML = e.value;
        nocache = Math.random();
        var tekstny= e.value;
            http.open('get', 'editsave.php?tekstny='+tekstny+'&nocache = '+nocache);
http.onreadystatechange = insertReply;
http.send(null);
        // placer onclick eventen igen på span elementet
        (function(e){
                e.onclick = function()
                {
                    myEditable(e, 'click');
                };
            })(parentElement);


    }
    function insertReply() {
if(http.readyState == 4){
var response = http.responseText;
// else if login is ok show a message: "Site added+ site URL".
document.getElementById('insert_response').innerHTML = ''+response;
}
} 

}
</script>
<p>
    <h1><div align="center"><span onclick="myEditable(this, 'click');"><?=$row["felt"]; ?></span></h1></div>
</p>    <div id="insert_response">Respons: </div>

这很好用。

但我现在想要添加更多要编辑的字段，然后在您开始编辑字段时显示提交按钮。

我该怎么做？

所以如果我有 5 个字段，它将输出：

http.open('get', 'editsave.php?field1='+field1+'&field2='+field2+'&field3='+field3+'&field4='+field4+'&field5='+field5+'&nocache = '+nocache);

感谢 stackoverflow 社区！

【问题讨论】：

你应该考虑获得一个 js 框架（例如 jquery）的帮助，它可以很容易地为你处理这些事情。
您没有充分发挥 jquery 的潜力。阅读文档。您至少不需要做自己的 http 请求对象。有一个函数可以序列化（）您的表单，它将所有输入包装成您想要的字符串。阅读文档，我保证你以后会感谢我的。

标签： javascript input insert field

【解决方案1】：

See this please. 有关于如何实现它的说明。谢谢

And other option.

【讨论】：