0
我的問題是，我不能關閉模型jquery流行時，當我包括日曆插件。這是我的代碼，請幫助我。關閉與datepicker模式jQuery的彈出
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Dialog - Modal form</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<style>
body { font-size: 62.5%; }
label, input { display:block; }
input.text { margin-bottom:12px; width:95%; padding: .4em; }
fieldset { padding:0; border:0; margin-top:25px; }
h1 { font-size: 1.2em; margin: .6em 0; }
div#users-contain { width: 350px; margin: 20px 0; }
div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
.ui-dialog .ui-state-error { padding: .3em; }
.validateTips { border: 1px solid transparent; padding: 0.3em; }
#fade { /*--Masque opaque noir de fond--*/
display: none; /*--masqué par défaut--*/
background: #000;
position: fixed; left: 0; top: 0;
width: 100%; height: 100%;
opacity: .80;
z-index: 9999;
}
.popup_block{
display: none; /*--masqué par défaut--*/
background: #fff;
padding: 20px;
border: 20px solid #ddd;
float: left;
/* font-size: 1.2em;*/
font-size: 0.9em;
position: fixed;
top: 50%; left: 50%;
z-index: 99999;
/*--Les différentes définitions de Box Shadow en CSS3--*/
-webkit-box-shadow: 0px 0px 20px #000;
-moz-box-shadow: 0px 0px 20px #000;
box-shadow: 0px 0px 20px #000;
/*--Coins arrondis en CSS3--*/
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
img.btn_close {
float: right;
margin: -55px -55px 0 0;
}
/*--Gérer la position fixed pour IE6--*/
*html #fade {
position: absolute;
}
*html .popup_block {
position: absolute;
} /*<script language="javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>*/
form label {
float: left;
width: 100px;
margin: 3px 0px 0px 0px;
font: 14px verdana, sans-serif;
font-weight : bold;
}
form input {
margin: 3px 3px 0px 0px;
border: 1px #999 solid;
}
body
{
font: 12px verdana, sans-serif;
margin: 10px;
padding: 0;
font-weight : bold;
background: grey;
}
.ui-datepicker { width: 17em; padding: .2em .2em 0; z-index:9000; }
</style>
<script>
$(function() {
$("#datepicker").datepicker();
});
</script>
</head>
<body>
<a href="#?h=900" rel="popup_name" class="poplight"><img src="ajouter.png" alt="AJOUTER"></a>
<div id="popup_name" class="popup_block">
<form id="formulairePAIEMENT" onkeypress="return keypress(event)" >
<p>REMARQUE:N'introduisez le monatant et l'échéance rééls que si reéllement ce réglement a eu lieu</p>
<div iddiv> </div>
<table border="0" cellspacing="10" >
<tbody>
<tr>
<td><label for="CodeFournisseur">Date</label>
<input type="text" name="datepicker" id="datepicker" onkeypress="entrer1(event);" /><br/>
</td>
<td><label for="prenomClient">Mode de paiement</label>
</tr>
<tr>
<td><label for="Activite">Comptabilisé</label>
<input type="text" name="Comptabilise" id="Comptabilise" onkeypress="entrer3(event);" maxlength="50"/></td>
<td><label for="adresse"> Montant théo </label> <input type="text" name="Montanthe" id="Montanthe" value="0" onkeypress="entrer4(event);" maxlength="50" onkeyup="testnombre2();" /></td>
<td> <label for="Pays"> Montant réel</label>
<input type="text" name="Montantreel" id="Montantreel" size="20" value="0" maxlength="20" onkeypress="entrer5(event);" onkeyup="testnombre1();" /> </td>
</tr>
<tr>
<td><label for="Ville"> Ech.Théorique </label>
<input type="text" name="echtheo" id="echtheo" onkeypress="entrer6(event);" size="20" maxlength="20"/></td>
<td><label for="codePostal">Ech.Réelle</label>
<input type="text" name="echreel" id="echreel" onkeypress="entrer7(event);" maxlength="6" /></td>
<td><label>Banque</label>
</tr>
<tr>
<td><label for="rc"> Emargement </label>
<input type="text" name="Emargement " id="Emargement" onkeypress="entrer11(event);" size="20" maxlength="20"/></td>
</tr>
<tr>
<td><label for="Ville">Libéllé</label>
<input type="text" name="Libelle" size="20" id="Libelle" maxlength="20"/></td>
</tr>
</tbody>
</table>
<div id="iddiv"> </div>
<br/>
<input type="text" name="idpaye" value="" hidden="true" />
<input type="button" name="action" value="Enregistrer" onclick="enregistrer();" />
</form>
</div>
<script>
$(document).ready(function() {
$('a.poplight[href^=#]').click(function() {
var popID = $(this).attr('rel'); //Trouver la pop-up correspondante
var popURL = $(this).attr('href'); //Retrouver la largeur dans le href
//Récupérer les variables depuis le lien
var query= popURL.split('?');
var dim= query[1].split('&');
var popWidth = dim[0].split('=')[1]; //La première valeur du lien
//Faire apparaitre la pop-up et ajouter le bouton de fermeture
$('#' + popID).fadeIn().css({
'width': Number(popWidth)
})
.prepend('<a href="#" class="close"><img src="close_pop.png" class="btn_close" title="Fermer" alt="Fermer" /></a>');
//Récupération du margin, qui permettra de centrer la fenêtre - on ajuste de 80px en conformité avec le CSS
var popMargTop = ($('#' + popID).height() + 80)/2;
var popMargLeft = ($('#' + popID).width() + 80)/2;
//On affecte le margin
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
//Effet fade-in du fond opaque
$('body').append('<div id="fade"></div>'); //Ajout du fond opaque noir
//
$("#ui-datepicker-div").css("z-index", "9999");
//Apparition du fond - .css({'filter' : 'alpha(opacity=80)'}) pour corriger les bogues de IE
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
return false;
});
//Fermeture de la pop-up et du fond
$('a.close, #fade').live('click', function() { //Au clic sur le bouton ou sur le calque...
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').close();
// //...ils disparaissent ensemble
location.reload(true);
});
//return false;
});
});
</script>
</body>
</html>
我可以SHOX彈出，壓光機，我可以選擇的日期，但whene我試圖關閉我的彈出式模型，它阻止，S請嘗試一下，幫助動原因我認爲probleme與流行模式插件。
您正在使用[.live（http://stackoverflow.com/questions/8042576/jquery-live-and-on之間的區別）。 使用.on代替.live函數。 –