如何从相同的表单中获取值结果？

Question

我如何从这个表格中获取价值结果？

<form name="forma" method="post" action="index.php"  id="dunja" >
    <p>
        Ime: <input id="ime" type="text" name="txtIme" value="" />
    </p>
    <p>
        Email: <input id="mail" type="text" name="txtEmail" value="" />
    </p>
    <p>
        <input type="submit" name="btnProsledi" value="Prosledi"  />
    </p>
</form>

而且，JS 是：

function sakupiPodatke(form){
    var delovi = [];
    var elementi = form.elements;

    for(var i=0; i<elementi.length; i++){
        var element = elementi[i];
        var naziv = encodeURIComponent(element.name);
        var vrednost = encodeURIComponent(element.value);

        delovi.push(naziv + "=" + vrednost);
    }

    return delovi.join("&");
}

var teloZahteva = sakupiPodatke(document.forma);

console.log(teloZahteva);

Php 文件也很简单：

<?php

$ime = $_POST["txtIme"];
$email = $_POST["txtEmail"];

?>

所以......我的问题是如何从console.log中的JS读取变量“teloZahteva”？

Answer 1

您的代码在页面首次加载时运行，在用户有机会填写表单之前。 所以它会在控制台中显示空值。

将代码放在用户单击提交按钮时运行的事件侦听器中。

 document.getElementById("dunja").addEventListener("submit", function(e) { e.preventDefault(); var teloZahteva = sakupiPodatke(e.target); console.log(teloZahteva); }); function sakupiPodatke(form) { var delovi = []; var elementi = form.elements; for (var i = 0; i < elementi.length; i++) { var element = elementi[i]; var naziv = encodeURIComponent(element.name); var vrednost = encodeURIComponent(element.value); delovi.push(naziv + "=" + vrednost); } return delovi.join("&"); }

 <form name="forma" method="post" action="index.php" id="dunja"> <p> Ime: <input id="ime" type="text" name="txtIme" value="" /> </p> <p> Email: <input id="mail" type="text" name="txtEmail" value="" /> </p> <p> <input type="submit" name="btnProsledi" value="Prosledi" /> </p> </form>

这会在控制台中显示表单值，而不是将表单发送到 PHP。

Answer 2

在我的代码之后，我写了这段代码，它说：

未捕获的 ReferenceError：createXHR 未定义

function formPost(url, form, callback){
    var xhr = createXHR();
    var data = sakupiPodatke(form);

    xhr.open("POST", url);
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

    xhr.onreadystatechange = function(){
        if(xhr.readyState === 4){
            var status = xhr.status;
            if ((status >= 200 && status < 300) || status === 304){
                callback(xhr.responseText);
            }else{
                alert("Greskica!");
            }
        }
    };
    xhr.send(data);;
}

function procesOdgovora(odgovor){
    alert(odgovor);
}

formPost("index.php", document.forma, procesOdgovora);

Answer 3

 <form name="forma" method="post" action="index.php"  id="dunja" >
     <p>
         Ime: <input id="ime" type="text" name="txtIme" value="" />
     </p>
     <p>
         Email: <input id="mail" type="text" name="txtEmail" value="" />
     </p>
     <p>
         <input type="submit" name="btnProsledi" value="Prosledi" onclick="handleSubmit()"  />
     </p>
 </form>



handleSubmit(){
  var ime =getElementById('ime').value;
  var mail =getElementById('mail').value;

}