Question

我在JSF portlet中使用AJAX。当会话到期时，我们假设得到以下消息（这是会话到期时AJAX请求的响应）

此页面用于在您获得请求授权时保存您的数据。

You will be forwarded to continue the authorization process. If this does not happen automatically, please click the Continue button below.
<CONTINUE BUTTON>

在IE 6和7中，我可以看到继续按钮。但在Firefox中我没有看到那个按钮。只有文字是可见的。但在源代码中，我可以看到该部分，但它在Firebug中显示为灰色。我已将屏幕截图上传到http://img31.imageshack.us/img31/619/firefoxcontinue.jpg 理想情况下，它应该自动将用户转发到登录页面，因为AJAX无法重定向，只显示响应。因此，必须在portlet中显示继续按钮。有人可以告诉我为什么HTML表单没有在Mozilla Firefox中显示。

由于

我创建了一个测试页面。当我们尝试在表格中插入表单时，问题出现了。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD>

 <BODY>
 <script type="text/javascript">
    function insertAjax(){
        // alert('inside ajax');
        document.getElementById("wpsportlet").innerHTML='This page is used to hold your data while you are being authorized for your request.<br/><br/>You will be forwarded to continue the authorization process. If this does not happen automatically, please click the Continue button below.<form action="http://www.google.com" method="get" name="AUTOSUBMIT"><input type="submit" value="Continue"/></form>';

    }

 </script>
 <input type=button value="Submit" onclick="insertAjax();">
  <div id="wpsportlet">


  </div>
 </BODY>
</HTML>

如果我将表单嵌套在表中，则表单不会显示在Firefox中。有人可以帮忙解决这个问题。

Answer 1

您生成的DOM无效。字符数据（文本）和＆lt; br＆gt;，＆lt; form＆gt;和＆lt; script＆gt;元素可能不是元素的子元素 - 只有＆lt; tbody＆gt;，＆lt; thead＆gt;和＆lt; tfoot＆gt;元素可能（虽然在XHTML中你也可以有＆lt; tr＆gt;元素）。

对于表格中存在的元素，它们必须完全出现在表格单元格中。

鉴于破坏的HTML，Firefox将很好地补偿作者错误，但是当使用JS生成破坏的DOM时，您可以绕过一些自动更正例程。

另外，您的Doctype（HTML + Transitional + No系统标识符）会触发Quirks mode - 这通常无法解决问题。

我建议：

切换到触发标准模式的文档类型
验证您的标记
使用纯HTML构建使用JavaScript添加的内容
验证
编写JavaScript以生成您现在测试为有效的DOM

Answer 2

为什么不在屏幕上显示响应时使用JavaScript添加按钮？
这种方式适用于所有浏览器......

function addButton() {  
    //Create an input type dynamically.  
    var element = document.createElement('input');  

    //Assign different attributes to the element.  
    element.setAttribute('type', 'button');  
    element.setAttribute('value', 'Continue');  
    element.setAttribute('name', 'somename');  
    element.setAttribute('id', 'someid');  

    var foo = document.getElementById("fooBar");  

    //Append the element in page
    foo.appendChild(element);  
}

Firefox没有显示表单

2 个答案: