javascript - ajax/javascript 语法

标签 javascript html ajax

我已将可能的错误范围缩小到 if 语句内。如果我的 php 文件在验证用户身份后返回 true,我会尝试使两个图像出现在 div 中。当我尝试使用“innerHTML”将图像添加到 div“b1”和“b2”时出现错误。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>
   <title> Incident Center </title>
   <!--<link rel="stylesheet" href="http://web.njit.edu/~swp5/assignment/style/style.css">-->
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
   <script type="text/javascript">
function ajaxFunction(){
    var ajaxRequest;  

    if (window.XMLHttpRequest)
    {
    ajaxRequest=new XMLHttpRequest();
    }
    else
    {
    ajaxRequest=new ActiveXObject("Microsoft.XMLHTTP");
    }

    ajaxRequest.onreadystatechange = function(){
        if(ajaxRequest.readyState == 4){
            if(ajaxRequest.responseText=="true")
            {
            //ERROR HERE
            document.getElementById('b1').innerHTML ="<img src="http://web.njit.edu/~swp5/assignment2/view.png" width=50 height=50>";
            document.getElementById('b2').innerHTML ="<img src="http://web.njit.edu/~swp5/assignment2/view.png" width=50 height=50>";

            }

            else
            {
            document.getElementById('n1').innerHTML = "<h4>IT WAS FALSE</h4>";
            }
        }
    }
    var un = document.getElementById('un').value;
    var pw = document.getElementById('pw').value;
    var queryString = "?un=" + un + "&pw=" + pw;
    ajaxRequest.open("GET", "auth.php" + queryString, true);
    ajaxRequest.send(null); 
}

    </script>
</head>

<body>


<div class="header">
Incident Center 

</div>



<p>


<div class="t1">
<form name='myForm'>
username: <input type='text' id='un'> <br>
password: <input type='password' id='pw'> <br>

<input type='button' onclick='ajaxFunction()' value='Enter' />
</form>
</div>



</p>


<p>

<div id="n1">
<div id="b1"></div>
<div id="b2"></div>
</div>

</p>

</body>



</html>

最佳答案

您的innerHTML值中有双引号。

document.getElementById('b1').innerHTML ="<img src="http://web.njit.edu/~swp5/assignment2/view.png" width=50 height=50>";
document.getElementById('b2').innerHTML ="<img src="http://web.njit.edu/~swp5/assignment2/view.png" width=50 height=50>";

更改为

document.getElementById('b1').innerHTML ='<img src="http://web.njit.edu/~swp5/assignment2/view.png" width=50 height=50>';
document.getElementById('b2').innerHTML ='<img src="http://web.njit.edu/~swp5/assignment2/view.png" width=50 height=50>';

请注意使用单引号将您尝试插入的字符串括起来,因为它们在内部使用了“。

同样,如果您想坚持仅使用双引号,则可以转义其中的引号,尽管在这种情况下似乎毫无意义。 JavaScript 中的转义字符是反斜杠。要进一步了解哪里出了问题,您可以阅读 http://www.quirksmode.org/js/strings.html这很好地涵盖了该主题。

关于javascript - ajax/javascript 语法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7909692/

相关文章:

html - Div 内联 block 元素未正确填充宽度

javascript - CSS 制作不同级别的 div。

jquery - Ajax POST 请求不会将数据保存在数据库中

javascript - 我的网络应用程序正在复制用户输入以进行发布,除非刷新页面进行删除,否则不会显示用户已删除

javascript - 引导日期选择器验证不起作用

javascript - 在 React 中使用 Axios 下载图像?

jquery - 在 jQuery 中使用 fadeIn 和 fadeOut 同时在 CSS 中使用过渡

javascript - 在 ActionPerformed 上添加 Div 响应

javascript - 在浏览器中播放音频

javascript - Vue 3 组合 API 数据()函数