我正在使用 JSF 开发一个网站,并且我正在努力实现新的 PORTO模板,现在我正在联系我们页面,它有一张地图,当我执行时不会显示,我不知道为什么,我在JS中有点弱。 所以请帮帮我!!
.xhtml:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="vendor/jquery.gmap.js"></script>
<script>
/*
Map Settings
Find the Latitude and Longitude of your address:
- http://universimmedia.pagesperso-orange.fr/geo/loc.htm
- http://www.findlatitudeandlongitude.com/find-address-from-latitude-and-longitude/
*/
// Map Markers
var mapMarkers = [ {
address : "New York, NY 10017",
html : "<strong>New York Office</strong><br/>New York, NY 10017",
icon : {
image : "img/pin.png",
iconsize : [ 26, 46 ],
iconanchor : [ 12, 46 ]
},
popup : true
} ];
// Map Initial Location
var initLatitude = 40.75198;
var initLongitude = -73.96978;
// Map Extended Settings
var mapSettings = {
controls : {
panControl : true,
zoomControl : true,
mapTypeControl : true,
scaleControl : true,
streetViewControl : true,
overviewMapControl : true
},
scrollwheel : false,
markers : mapMarkers,
latitude : initLatitude,
longitude : initLongitude,
zoom : 16
};
var map = $("#googlemaps").gMap(mapSettings);
// Map Center At
var mapCenterAt = function(options, e) {
e.preventDefault();
$("#googlemaps").gMap("centerAt", options);
}
</script>
</h:head>
<h:body>
<ui:composition template="/WEB-INF/Publique/template.xhtml">
<ui:define name="title">Corporate Software : Nous Contactez </ui:define>
<ui:define name="content">
<div role="main" class="main">
<section class="page-top">
<div class="container">
<div class="row">
<div class="col-md-12">
<ul class="breadcrumb">
<li><a href="index">Acceuil</a></li>
<li class="active">Nous Contactez</li>
</ul>
</div>
</div>
<div class="row">
<div class="col-md-12">
<h2>Nous Contactez</h2>
</div>
</div>
</div>
</section>
<!-- Google Maps -->
<div id="googlemaps" class="google-map hidden-xs"></div>
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="alert alert-success hidden" id="contactSuccess">
<strong>Succés!</strong> Nous avons reçus votre message.
</div>
<div class="alert alert-danger hidden" id="contactError">
<strong>Erreure!</strong> Une Erreure c'est produite lors du
l'envois de votre message.
</div>
<h2 class="short">
Nous <strong>Contactez</strong>
</h2>
<h:form id="form1">
<div class="row">
<div class="form-group">
<div class="col-md-6">
<label>Nom Complet *</label>
<h:inputText type="text"
value="#{messageMBean.message.nomComplet}"
data-msg-required="Entrer votre nom s'il vous plait."
maxlength="100" class="form-control" name="name" id="name" />
</div>
<div class="col-md-6">
<label>Votre email *</label>
<h:inputText type="email"
value="#{messageMBean.message.email}"
data-msg-required="Entrer votre email s'il vous plait."
data-msg-email="Entrer un email valide s'il vous plait."
maxlength="100" class="form-control" name="email" id="email" />
</div>
</div>
</div>
<div class="row">
<div class="form-group">
<div class="col-md-12">
<label>Sujet *</label>
<h:inputText type="text"
value="#{messageMBean.message.objet}"
data-msg-required="Please enter the subject."
maxlength="100" class="form-control" name="subject"
id="subject" />
</div>
</div>
</div>
<div class="row">
<div class="form-group">
<div class="col-md-12">
<label>Message *</label>
<h:inputTextarea maxlength="5000"
value="#{messageMBean.message.textMessage}"
data-msg-required="Entrer votre message s'il vous plait."
rows="10" class="form-control" name="message" id="message" />
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<h:commandButton value="Envoyer"
actionListener="#{messageMBean.save}"
class="btn btn-primary btn-lg">
<p:ajax update="form1" />
</h:commandButton>
</div>
</div>
</h:form>
</div>
<div class="col-md-6">
<h4 class="push-top">
Get in <strong>touch</strong>
</h4>
<p>
Si vous êtes interéssés par nos services, ou bien vous voulez
faire partie de notre equipe, ou vous avez n'import quelle
Question!! <strong>N'hesitez pas !</strong>
</p>
<hr />
<h4>
Notre <strong>Agence</strong>
</h4>
<ul class="list-unstyled">
<li><i class="icon icon-map-marker"></i> <strong>Addresse:</strong>
6 bis, rue Najib Mahfoud, Casablanca</li>
<li><i class="icon icon-phone"></i> <strong>TéléPhone:</strong>
0212 522 266 545/90</li>
<li><i class="icon icon-envelope"></i> <strong>Email:</strong>
<a href="mailto:mail@example.com">Corporate@corporate.ma</a></li>
</ul>
<hr />
<h4>
<strong>Heurs</strong> de Travail
</h4>
<ul class="list-unstyled">
<li><i class="icon icon-time"></i> Lundi - Vendredi 9am to
5pm</li>
<li><i class="icon icon-time"></i> Samedi - 9am to 2pm</li>
<li><i class="icon icon-time"></i> Dimanche - Fermé</li>
</ul>
</div>
</div>
</div>
</div>
<section class="call-to-action featured footer">
<div class="container">
<div class="row">
<div class="center">
<h3>
Corporate Software, c'est <strong>tous</strong> ce dont vous avez
<strong>besoin</strong>! <a
href="http://themeforest.net/item/porto-responsive-html5-template/4106987"
target="_blank" class="btn btn-lg btn-primary"
data-appear-animation="bounceIn">Contactez Nous!</a> <span
class="arrow hlb" data-appear-animation="rotateInUpLeft"
style="top: -22px;"></span>
</h3>
</div>
</div>
</div>
</section>
</ui:define>
</ui:composition>
----------- ----------- EDITED
我想我明白发生了什么,但不知道如何撤消它!!!
当xhtml被解析为html <script>
标签之间的任何内容变成评论之间<!-- -->
我查了一下,这似乎是某种黑客对策!!!,但我不知道知道如何禁用它。
任何想法!! 想你。
答案 0 :(得分:1)
我发现解决方案非常简单,我教过如果有人需要,我应该分享它。
您在项目中创建新的javascript文件,并在其中复制JS代码并在xhtml文件中写入。
然后将其包含在xhtml中,并在头部显示<script src="file.js"></script>
并瞧!!!“
它的工作!!!!