Javascript 在Tomcat7.0服务器上使用Ajax和JSF时遇到问题_Javascript_Ajax_Jsf

Javascript 在Tomcat7.0服务器上使用Ajax和JSF时遇到问题

javascript ajax jsf

Javascript 在Tomcat7.0服务器上使用Ajax和JSF时遇到问题,javascript,ajax,jsf,Javascript,Ajax,Jsf,谈到Ajax，我是一个完全的初学者，由于某些原因，我无法得到一个简单的例子来工作 javascript： var xmlhttp; function reloadIssues() { if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP")

谈到Ajax，我是一个完全的初学者，由于某些原因，我无法得到一个简单的例子来工作

javascript：

var xmlhttp;
function reloadIssues() 
{
    if (window.XMLHttpRequest) 
    {
        xmlhttp = new XMLHttpRequest();
    } 
    else 
    {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange = function() 
    {
        if (xmlhttp.readyState == 4) 
        {
            document.getElementById("tester").innerHTML = xmlhttp.responseText;
        }
    };


    xmlhttp.open("GET", "test.xhtml", true);
    xmlhttp.send();

}

以及测试xhtml页面：

<div id="test">
    TEST TEXT
</div>
<button type="button" onclick="reloadIssues()">Change Content</button>


测试文本
更改内容

调用JS文件

我对它进行了一些测试，似乎“xmlhttp.onreadystatechange”始终为空，并且它从未进入其函数

除了代码之外，还有其他问题吗？可能在tomcat服务器上？

相关元素的id为

test

<div id="test">

相应地修复它

与具体问题无关在讨论ajax时，我建议采用一个合适的框架，而不是家庭成长的框架。我可以热情地推荐做ajax工作。这样就很容易了：

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
    $(document).ready(function() {
        $('#change').click(function() {
            $.get('test.xhtml', function(responseText) {
                $('#test').text(responseText);
            });
        });
    });
</script>

<body>
    <div id="test">TEST TEXT</div>
    <button id="change">Change content</button>
</body>

或者当您仍然使用JSF 1.x时，采用基于Ajax的组件库，如RichFaces、IceFaces、PrimeFaces等。

复制粘贴时，“test”和“tester”是一个错误。我不知道JSF支持Ajax，我试过了，效果非常好！我非常感谢您的帮助，谢谢：）可以在JSF1.2中使用PrimeFaces吗？我以为它只适用于JSF2。0@lkdg：PrimeFaces是第一个基于JSF2.0规范自上而下设计的组件库。稍后将为JSF1.2进行后端口。现在它只是不再维护了。你可以在这里找到它们：

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
    $(document).ready(function() {
        $('#change').click(function() {
            $.get('test.xhtml', function(responseText) {
                $('#test').text(responseText);
            });
        });
    });
</script>

<body>
    <div id="test">TEST TEXT</div>
    <button id="change">Change content</button>
</body>

<h:form>
    <h:commandButton value="Change content" action="#{bean.change}">
        <f:ajax execute="@form" render=":test" />
    </h:commandButton>
</h:form>
<h:panelGroup id="test" layout="block">#{bean.text}</h:panelGroup>

public void change() {
    this.text = "new text";
}