如何将图库从其他页面加载到我页面上的div中?

时间:2010-05-27 12:28:17

标签: jquery

好的,所以我是jquery的新手。

我想要做的是在一个页面中拥有多个画廊。 在另一个页面我有一个div和一些链接。根据您在div中显示的库中单击的链接应该更改。

我的所有链接都有不同的ID和我的所有画廊。

我知道应该有办法用Jquery做到这一点。任何人都可以告诉我如何做到这一点。

谢谢:)

3 个答案:

答案 0 :(得分:1)

假设每个链接的href指向感兴趣的图库,您可以执行以下操作:

$(document).ready(function() {

    // bind to the click event of each link with class 'gallery'
    $("a.gallery").click(function() {

        // load the HTML at the href of the clicked link into a div
        $("#galleryDiv").load($(this).attr("href"));
    });
});

如果您只想加载目标网页的部分,只需将相应的选择器添加到load的网址参数,例如:

// only fetch <div id="galleryDiv"> from target page
$("#galleryDiv").load($(this).attr("href") + " #galleryDiv");

答案 1 :(得分:0)

您可以为每个图库添加标签,并通过AJAX加载图库内容。我建议退房:http://jqueryui.com/demos/tabs/#ajax

答案 2 :(得分:0)

当我的用户点击购买按钮时,希望我网站上的其他页面加载他们选择的产品图片以插入到buy.html上的div中。 (第一页HTML)

<td width="203"><img src="images/chocoImage4.png" width="190" height="206" class="birthpic1"/> Hershey's Bouquet Mix $32</td>
<td width="211"><img src="images/chocoImage5.png" width="190" height="206" class="birthpic2"/>Chocolate Strawberry $52</td>
<td width="203"><img src="images/chocoImage6.png" width="190" height="200" class="birthpic3"/>Chocolate Strawberry $42</td>

    

(第二页html purchase.html)

<div class="aside">
  <div class="hours"><!-- TemplateBeginEditable name="hours" -->
    <p><strong>North Las Vegas</strong> Coming Soon!!!<br />
      <strong>Monday-Friday:</strong> 9:00 am — 5:00 pm<br />
      <strong>Saturday: </strong>8:00am — 2:00 pm</p>
  <!-- TemplateEndEditable --></div>
  <div id="imagePicked">
  <p>Hello</p>
  </div>

JavaScript(代码)

function load_Product () {
var theDomain = window.location.assign("purchase1.html");
var d = document.getElementById("imagePicked");
var p = d.childNodes[0];
var imageContent = p.innterHTML;
var productImage = '<img    src="http://flowersbyreginalv.com/chocoImage1.png">';
imageContent = productImage;
loadSum = imageContent + theDomain;
}