Question

我有一个ajax call()来加载有关产品的一些特定信息：

function fnShowDetProd(code, size) {    
    mod.open("GET", "control/_showdetailproduct.asp?cod="+code+"&size="+size, true);    
    mod.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");    
    mod.onreadystatechange = function() {
        if (mod.readyState == 4) {          
            document.getElementById("showDetails").innerHTML = mod.responseText;            
        }
    };
    mod.send(null)  
}

我在我的行onClick事件中调用此函数：

 fnMostDetProd(selectedRow[0], selectedRow[1]);

其中selectedRow [0]和[1]是单击行的参数。

我想知道是否可以添加jQuery效果，例如fadeIn()，以显示在showDetails元素上检索到的信息。

使用jQuery 1.8.3和jQuery ui 1.10.1。

Answer 1

这个怎么样：

function fnShowDetProd(code, size) {    
    mod.open("GET", "control/_showdetailproduct.asp?cod="+code+"&size="+size, true);    
    mod.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");    
    mod.onreadystatechange = function() {
    if (mod.readyState == 4) {          
        $("#showDetails").hide();
        $("#showDetails").html(mod.responseText);
        $("#showDetails").fadeIn();
    }
};
mod.send(null)
}

Answer 2

您可以： http://jsfiddle.net/X5jUC/

让你的div隐藏......

<div id="showDetails" style="display:none;"></div>

然后你要做的就是这个...

$("#showDetails").html('replace this with your mod.responseText').fadeIn( 3000, function() {
    // Animation complete
});

3000表示淡入需要3秒钟，漂亮而缓慢。根据自己的喜好增加或减少它。

显示在innerHTML元素上检索的信息的效果

2 个答案: