onclick 重定向和延迟加载答案

【问题标题】：onclick redirection and lazy loadonclick 重定向和延迟加载
【发布时间】：2015-05-19 09:46:56
【问题描述】：

当我单击signin.xhtml 上的commandButton 时，我想运行一个javascript 函数，但是当我单击它时，会重定向到dev.xhtml。我不想要这种重定向，我想留在 signin.xhtml 上。实际上它并不是真正的重定向，因为它是相同的 index.xhtml 页面，但具有延迟加载。

这是来自 signin.xhtml 的命令按钮：

<h:form id="formSignInPartner" enctype="multipart/form-data">
  <p:commandButton value="Géolocaliser mon commerce" onclick="getLocation()"/> 
</h:form>

还有 index.xhtml ：

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:pm="http://primefaces.org/mobile"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">
     <f:view renderKitId="PRIMEFACES_MOBILE" />
     <h:head>
        <script type="text/javascript" src="../javascript/geolocalisationPartner.js"></script>
     </h:head>
     <h:body>
        <pm:page id="dev" lazy ="false">
            <ui:include src="trash/dev.xhtml"/>
        </pm:page>
        <pm:page id="partnerSignIn" lazy="true">
            <ui:include src="/Partner/signIn.xhtml"/>
        </pm:page>
      </h:body>
    </html>

这里的脚本 geolocalisationPartner.js 但我不认为这是问题

var options = {
    enableHighAccuracy: true,
    timeout: 5000,
    maximumAge: 0
};
function error(msg) {
    alert('Geolocalisation échouée :\n' + msg);
}
function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition, error, options);
    } else {
        alert('Votre navigateur\nne supporte pas\nla geolocalisation');
     }
}

function showPosition(position) {
    var long = position.coords.longitude;
    var lat = position.coords.latitude;
    $(PrimeFaces.escapeClientId('partnerSignIn:formSignInPartner:idlongitude')).val(long);
    $(PrimeFaces.escapeClientId('partnerSignIn:formSignInPartner:idlatitude')).val(lat);
    alert('Geolocalisation réussie !');

}

【问题讨论】：

我发现了问题。在 javascrip 控制台中，我看到我的脚本文件没有找到。还是谢谢

标签： javascript onclick lazy-loading primefaces-mobile

【解决方案1】：

您可以使用event.preventDefault

脚本

function getLocation(e) {
    e.preventDefault()
    // your code here
}

xhtml

<p:commandButton value="Géolocaliser mon commerce" onclick="getLocation(e)"/>

【讨论】：

【解决方案2】：

如果您不希望它链接，您需要cancel 该事件。

function getLocation(evt) {
     evt.preventDefault();
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition, error, options);
    } else {
        alert('Votre navigateur\nne supporte pas\nla geolocalisation');
     }
}

更新您的 html：

<p:commandButton value="Géolocaliser mon commerce" onclick="getLocation(evt)"/>

【讨论】：

谢谢，但它不起作用。更糟糕的是，在添加阻止默认值之前，我可以再次到达 signin.xhtml，然后 commandButton 没有重定向我（第一次点击后 url 从localhost:8080/Zelda-web 更改为localhost:8080/Zelda-web/faces/index.xhtml）但现在它每次都重定向我

【解决方案3】：

我发现了问题。在 javascrip 控制台中，我看到我的脚本文件没有找到，路径错误。

【讨论】：