你的確可以使用jQuery做這個很好!
假設您的聯繫方式頁面上的聯繫表格包含在id="myContactForm"
的div中。您可以將選擇器(例如,'#myContactForm'
)與要加載內容的URL組合在一起。您可以通過多種不同的方式將表單(或任何其他內容)直接加載到當前頁面中。我個人更喜歡jqModal來滿足我的模式窗口需求,但如果您使用其他任何東西,您可以使用jQuery.load方法本身。
所以,如果你的第一頁被命名爲「master.html」和您的聯繫方式被命名爲「contact.html」,這裏就是你可以「master.html」裏面做什麼:
<div id="someDiv">
Please <a id="contactLink" href="contact.html">contact us</a> with
any questions!
</div>
<div id="myModalPlaceholder">
Modal content would go in here; this div is initially hidden.
</div>
這如果沒有javascript,當然會鏈接到聯繫表單。但是,您只想提取「contact.html」的一部分並將其顯示在您的母版頁上。這裏是你如何完成你的master.html頁面上你的目標的想法:
<script type="text/javascript">
$(document).ready(function() {
$('#contactLink').click(function() {
$('#myModalPlaceholder').load('contact.html #myContactForm');
return false; // cancel the native click event
});
});
</script>
你注意到在「加載」方法從區域只想搶在目標頁面上分離的URL空間。你可以閱讀更多關於這個here。這將從contact.html
頁抓取#myContactForm
div,並將其插入您的母版頁#myModalPlaceHolder
div。
祝你好運!
-Mike
這正是我需要的,邁克! jQuery永遠不會讓我印象深刻 - 我不知道你可以在加載函數中使用類似jQuery的選擇器。謝謝你非常透徹的回答。 – adamisnt 2009-06-16 16:53:27