Question

使用以下代码提醒状态ERROR。当我将commandButton放在表单之外或在alert()状态geocode()结尾处放置另一个OK时，系统会提醒您。这里发生了什么？

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head>

    <script src="https://maps.googleapis.com/maps/api/js?v=3&amp;sensor=false"></script>

    <script>
    var geocoder;
    geocoder = new google.maps.Geocoder();

    function geocode() {
        geocoder.geocode({'address' : 'china'},geocoderCallback);
    }

    function geocoderCallback(results, status) {
        alert(status);
        };
    </script>

</h:head>

<h:body>

    <h:form>
    <h:commandButton onclick="geocode()" value="geocode" />
    </h:form>

</h:body>
</html>

Answer 1

开始更改代码

onclick="geocode()"

进入

onclick="geocode(); return false;"

这种行为的原因是因为当<h:commandButton位于h:form内（并且您没有使用f:ajax）时，您正在进行整页提交

由于整个页面提交，将发生页面重新加载（以及那些混乱的地图），然后重新加载你的回调（'geocoderCallback'）被称为

如果您将<h:commandButton移到h:form之外，它将不会执行任何页面提交，只会调用js代码，在这种情况下一切正常（您的地图不会“混乱”）< / p>

同样适用于地理编码（）的“另一个警报（）”它将在页面提交之前显示警报（在地图被“搞乱”之前）

如何解释JSF和Javascript的这种行为？

1 个答案: