xmlhttp.responsetext无法正常工作

时间:2015-02-25 08:00:02

标签: javascript

我想从秘密创建一个随机秘密和QRcode。 我有一些代码设计和一些javascripts代码的功能。当我点击创建新的秘密按钮我看到文本框中的Html标签而不是密码。这样:   

<div align="left">
<label>Google Authenticator Setting</label>
<form>
<br>
secret: <input type="text" id="mysecret" name="secret" value="" >
<br>
<input type="Button" class="elgg_button" value="Create new secret"       width="610px" onclick = "newSecret()" >
<input type="Button" id="qrcodebtn" class="elgg_button" value="Show/Refresh qrcode"   width="610px" onclick = "genQrCode()" >
</form>
<br>
</div>
<div id="qrcode" style="text-align: center;margin-left: auto;margin-right:  auto;width:700px"></div>
<br>
<script type="text/javascript">
var qrcode = new QRCode(document.getElementById("qrcode"), 
{
width : 200,
height : 200
});

var qrurl;

function stringGen(len)
{
var text = "";

var charset = "ABCDEFGHIJKLMNOPQRSTUVWXYZ234567";

for( var i=0; i < len; i++ )
    text += charset.charAt(Math.floor(Math.random() * charset.length));

return text;
}

function newSecret()
{
var xstr = "";
qrurl = "";
document.getElementById('mysecret').value = "";

window.XMLHttpRequest
{
    xmlhttp = new XMLHttpRequest();
}

//xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function() 
{
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    {
        //alert(xmlhttp.responseText);
      xstr=xmlhttp.responseText;
    }
}
xmlhttp.open("POST","mod/test/views/default/test/coder.php",false);
xmlhttp.send();

  if(xstr != "")
{
     var res = xstr.split(";");
    qrurl = res[1];
    document.getElementById('mysecret').value = res[0];

}
else
{
    alert("Empty Str!")
}
}
function genQrCode()
{
if (qrurl=="") 
{
    alert("Generate a text");
    return;
}
qrcode.makeCode(qrurl);
}
</script>

1 个答案:

答案 0 :(得分:1)

Ajax是异步的。

这意味着:您向服务器发送请求。回复需要一些时间。在等待响应时,其余代码将被执行。 所以你不能使用xstr,只是假设它存在于(代码中较大的行号)xmlhttp.send();

相反,Ajax是如何工作的:你给出一个回调,一个响应回来后将被执行的函数。 这个功能:

xmlhttp.onreadystatechange = function() {
  if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
    //alert(xmlhttp.responseText);
    xstr = xmlhttp.responseText;
  }
}
// notice: xstr is empty here

您应该只在此功能中使用xstr。继续那里。像这样:

xmlhttp.onreadystatechange = function() {
  if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
    xstr = xmlhttp.responseText;
    if(xstr != "") {
      var res = xstr.split(";");
      qrurl = res[1];
      document.getElementById('mysecret').value = res[0];
    }
  }
}