ThickBox：由 Cody Lindley 开发
jQuery Forms：这是由 jQuery 社区合作开发
JTip：由 Cody Lindley 开发，并由 jQuery 社区进行扩展
GreyBox：由 Amir Salihefendic 开发
了解应用程序：Customize Me Now 1.0
以下小结帮助您了解 Customize Me Now 1.0 — 它的用户体验和源代码。
用户体验
图 1 展示了 Customize Me Now Results 页面和一个信息弹出窗口。它演示了站点能够向用户提供的与他们定制的产品有关的信息。尽管最佳的用户路径是从搜索和结果到定制和购买的直线路径，但该界面 却提供了一些迂回的路径。站点使用传统的弹出窗口显示每个产品和产品选项的一小段上下文信息。单击 Pizza，您将会看到关于站点的批萨产品的信息。单击 Cheese，您将会看到关于您的批萨可用的奶酪的信息。此外，用户可以导航到厂商的 Web 站点 — 同样通过弹出窗口呈现。
<script type="text/javascript">
/*create a thickbox for our form submittal*/
//when the document is ready
$(document).ready(function() {
//wrap form#comparison in an ajaxForm object
$('#comparison').ajaxForm({
//intercept the submit event with a callback
beforeSubmit: function(formData, jqForm, options) {
//serialize form data; append to the form action; tack on ThickBox params
var URL = jqForm[0].action + "?" + $.param(formData);
URL += "&KeepThis=true&TB_iframe=true&height=400&width=600";
//call ThickBox directly
var caption = null;
var imageGroup = false
tb_show(caption,URL,imageGroup);
//cancel the form submission by returning false
return false;
}
});
});
</script>
这段代码展示了 jQuery API 的简单性。通过少量代码，您就截取了一个 HTML 表单的正常提交，并执行了一些定制 JavaScript 代码。使用这种技术，您可以在允许提交表单之前执行定制验证逻辑，或者在表单提交之后触发一个定制事件。在本例中，您需要避免提交表单。相反，我们将手动 “伪造” 表单提交生成的 HTTP 请求，以便将表单的目标定向到 ThickBox 窗口。
