Question

在我的投资组合页面上，我有这样的设置：

<div id="portfolio">
        <ul id="sites">
          <li>
            <h3><a href="#">MotorSomethin</a></h3>
            <img src="http://dummyimage.com/265x100/000/fff" />
            <p>
              We tried going for a very dark but flashy look for this website. Hence the reason we used flash.
            </p>
          </li>
          <li>
            <h3><a href="#">MotorSomethin</a></h3>
            <img src="http://dummyimage.com/265x100/000/fff" />
            <p>
              We tried going for a very dark but flashy look for this website. Hence the reason we used flash.
            </p>
          </li>
          <li>
            <h3><a href="#">MotorSomethin</a></h3>
            <img src="http://dummyimage.com/265x100/000/fff" />
            <p>
              We tried going for a very dark but flashy look for this website. Hence the reason we used flash.
            </p>
          </li>
          <li>
            <h3><a href="#">MotorSomethin</a></h3>
            <img src="http://dummyimage.com/265x100/000/fff" />
            <p>
              We tried going for a very dark but flashy look for this website. Hence the reason we used flash.
            </p>
          </li>
          <li>
            <h3><a href="#">MotorSomethin</a></h3>
            <img src="http://dummyimage.com/265x100/000/fff" />
            <p>
              We tried going for a very dark but flashy look for this website. Hence the reason we used flash.
            </p>
          </li>
        </ul>
      </div>

想象一下网格，每行2个网站。

我想使用jQuery，以便当我点击H3，图像或LIE内的段落（这些都是关于某个站点的信息）时，它会淡出整个UL，然后获取有关该站点的信息来自我们的数据库。

我认为这需要AJAX，但我没有太多经验。我也很困惑如何在获取信息后使用jQuery编写新的HTML。

Answer 1

不是100％确定你想要什么，但尝试这样的事情：

$("li").click(function() {
    $("#portfolio").fadeOut();

    // This performs an ajax-request to the "url/to/fetch". 
    // Then puts the result in the portfolio-div. finally 
    // it fades the results back in.
    $.get("url/to/fetch",{},function(data) {
        $("#portfolio").html(data);    
        $("#portfolio").fadeIn();
    });
});

jQuery从数据库淡出<ul>和淡入信息</ul>

1 个答案: