1
我有一个用户可以登录并检查他们向我们提出的突出支持问题的网站，本网站是用于管理每个公司联系人的页面。在更新网站时，我已经开始使用jQuery加载子页面，以便用户不会每次都刷新页面。当该子页面加载到div时，我开始遇到加载JavaScript的问题。让页面加载到div中时运行jQuery的函数
的过程如下：
用户点击设置链接，它加载的settings.php（整页刷新）
用户点击“管理联系人”选项，它会加载到managecontacts.php DIV＃settingsph
从选择框中，用户选择他们希望更新的联系人，这会将该用户数据加载到div＃contact_info（选择框下方），并使用该选项的值作为联系人ID通过editcontact.php查询数据库并将其呈现为进行更改的表单。
一旦加载了这个页面，我打算使用jQuery验证和ajax函数来提交没有页面刷新的表单。但是，我似乎无法获得JavaScript加载在这一点上。我试过将主要页面<head>标记中的文件引用为<head>标记中的文件，将其作为<head>标记中的脚本，作为editcontact.php中的文件并作为editcontact.php中的脚本引用，但似乎没有一个脚本加载脚本以隐藏我的错误标签，或提交更新。
代码：editcontact.php
<?php
session_start();
require '../dbsettings.php';
header ("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header ("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header ("Cache-Control: no-cache, must-revalidate");
header ("Pragma: no-cache");
header("content-type: application/x-javascript; charset=tis-620");
?>
<?php
$id = $_GET['id'];
if($id!=''){
if($id!='NewContact'){ //if valid id has been supplied for db retrieval
try
{
$db = new PDO('mssql:host=' . DBHOST . ';dbname=' . DBDATA, DBUSER, DBPASS);
}
catch(PDOException $error)
{
echo "<h2>Error! " . $error->getmessage()."</h2>";
die();
}
$query = " SELECT ContactID, Surname, Forename, Phone, Email, JobTitle, MobileNumber, LeaveDate
FROM Contact
WHERE CompanyID ='" . $_SESSION['companyid'] . "' AND ContactID='" . $id . "'
ORDER BY Forename ASC";
foreach($db->query($query) as $contact)
{
?>
<!--Have tried putting the script between <script> tags here-->
<div id="contact_update">
<form>
<h3>Personal Information</h3>
<label for="forename">Forename(s):</label>
<input name="forename" id="forename" value="<?php echo $contact['Forename']; ?>" class="text-input" />
<label class="error" for="forename" id="forename_error">Forename is required.</label>
<br />
<label for="surname">Surname:</label>
<input name="surname" id="surname" value="<?php echo $contact['Surname']; ?>" class="text-input" />
<label class="error" for="surname" id="surname_error">Surname is required.</label>
<br />
<label for="jobtitle">Job Title:</label>
<input name="jobtitle" id="jobtitle" value="<?php echo $contact['JobTitle']; ?>" class="text-input" />
<br />
<h3>Contact Information</h3>
<label for="phone">Telephone: </label>
<input name="phone" id="phone" value="<?php echo $contact['Phone']; ?>" class="text-input" />
<label class="error" for="phone" id="phone_error">Telephone is required.</label>
<br />
<label for="mob">Mobile: </label>
<input name="mob" id="mob" value="<?php echo $contact['MobileNumber']; ?>" class="text-input" />
<br />
<label for="email">Email:</label>
<input name="email" id="email" value="<?php echo $contact['Email']; ?>" class="text-input" />
<label class="error" for="email" id="email_error">Email is required.</label>
<br />
<h3>Misc Information</h3>
<label for="ldate">Leave Date:</label>
<input name="ldate" id="ldate" value="<?php echo $contact['LeaveDate']; ?>" class="text-input" />
<label for="ldate" class="hint">* Leave blank if still an active user</label>
<br />
<input type="submit" name="submit" value="Update" class="button" id="update_button" />
</form>
</div>
<?php
} //end of foreach
}else{ //else a new contact is being added
?>
<div id="contact_add">
<form>
<h3>Personal Information</h3>
<label for="forename">Forename(s):</label><input name="forename" id="forename" /><br />
<label for="surname">Surname:</label><input name="surname" id="surname" /><br />
<label for="jobtitle">Job Title:</label><input name="jobtitle" id="jobtitle" /><br />
<h3>Contact Information</h3>
<label for="phone">Telephone: </label><input name="phone" id="phone" /><br />
<label for="mob">Mobile: </label><input name="mob" id="mob" /><br />
<label for="email">Email:</label><input name="email" id="email" /><br />
<input type="submit" value="Update" />
</form>
</div>
<?php
}
}else{ //else page was not generated with id, possibly not using javascript - die, without allowing access
echo 'ERROR 403 - FORBIDDEN';
die();
}
?>
代码：jquery.settings.js
// JavaScript Document
$(function managecontacts() {
$('.error').hide();
$('input.text-input').css({backgroundColor:"#ffffe0"});
$('input.text-input').focus(function(){
$(this).css({backgroundColor:"#FFFFFF"});
});
$('input.text-input').blur(function(){
$(this).css({backgroundColor:"#ffffe0"});
});
$(".button").click(function() {
// validate and process form
// first hide any error messages
$('.error').hide();
var forename = $("input#forename").val();
if (forename == "") {
$("label#forename_error").show();
$("input#forename").focus();
return false;
}
var surname = $("input#surname").val();
if (surname == "") {
$("label#surname_error").show();
$("input#surname").focus();
return false;
}
var email = $("input#email").val();
if (email == "") {
$("label#email_error").show();
$("input#email").focus();
return false;
}
var phone = $("input#phone").val();
if (phone == "") {
$("label#phone_error").show();
$("input#phone").focus();
return false;
}
var jobtitle = $("input#jobtitle").val();
var mobile = $("input#mob").val();
var ldate = $("input#ldate").val();
var dataString = 'forename=' + forename + '&surname=' + surname + '&jobtitle=' + jobtitle '&email=' + email + '&phone=' + phone + '&mobile=' + mobile + '&ldate=' + ldate;
//alert (dataString);return false;
$.ajax({
type: "POST",
url: "Includes/stg/contactprocess.php",
data: dataString,
success: function() {
$('#contact_update').html("<div id='message'></div>");
$('#message').html("<h2>Contact Successfully Updated</h2>")
.append("<p>Thank you.</p>")
.hide()
.fadeIn(1500, function() {
$('#message').append("<img id='checkmark' src='images/tick.png' />");
});
}
});
return false;
});
});
代码：<head>标签的页面加载到div的
<script type="text/javascript">
function open_page(name) {
$("#settingsph").load("Includes/stg/"+name+".php");
}
function open_contact(id) {
$("#contact_info").load("includes/stg/editcontact.php?id="+id);
}
</script>
任何帮助，可以关于这是否可能，或者我是否需要回到绘图博ard将不胜感激。
这样做的窍门，但它不会用于.hide（）事件。 – Stann0rz 2010-03-02 15:42:07
简直不敢相信我不够傻，不能用CSS隐藏它们，我最终也是这样。感谢Fudgey，提供一种享受。 – Stann0rz 2010-03-02 16:58:46
Hiya，很高兴你能工作，但'.hide（）'不是一个事件。它包含在'click'，'focus'和'blur'事件中，所以它应该完全按照原样工作。 :) – Mottie 2010-03-03 00:07:16