日期:2014-05-16  浏览次数:20366 次

求高手指点用ajax获取的数据来操作页面的相关代码
asp程序;
a页面是一个新闻列表,表格形式 有10行
每行<tr> 的id为当前条数的id号

打开页面时 取得这10行的id号 10个, 比如 1,2,3,4,5,6,7,8,9,10


10秒后通过ajax异步请求一次,返回是 x个id号 比如 1,3,4,5,6,7,8,12

要求高手给个对比 A:【打开页面时取得的这串id号】与 B:【ajax异步请求的一串id号】的代码,判断出【少了哪些】和【多了哪些】;并操作少了的<tr> 标签 让其变背景或直接 display:none;多出来的id号总数输出到一个span中即可。

实现上面这功能的代码求指点



------解决方案--------------------
HTML code


<script type="text/javascript">

var a = [1,2,3,4,5];
var b = [3,4,5,6,7];
var c = f(a,b);
var d = f(b,a);
function f(a,b){
    var c = (a.join(",")+",").replace(  ( new RegExp( b.join(",|")+",|","g" ) ) ,"" ).split(",");
    c.pop();
    return c;
}

alert(c);
alert(d)

</script>

其余的自己搞定咯,要好评哦

------解决方案--------------------
1楼的方法比较巧妙,以下是常规实现

JScript code
//将数组转为对象
function toMap(list, value){
    var map = {};
    for(var i = 0, len = list.length; i < len; i++){
        map[list[i]] = value != null? value : i;
    }
    return map;
}

//筛选出不在map中的元素
function compare(list, map, fn){
    var tmp = [];
    for(var i = 0, len = list.length; i < len; i++){
        var id = list[i];
        //不在map中的元素
        if(!map[id]){
            if(typeof fn == "function") fn(id);  //回调函数
            tmp.push(id); 
        }
    }
    return tmp;
}

//执行比较并更新元素
function update(listA, listB){
    var mapA = toMap(listA, true), mapB = toMap(listB, true), more = [], less = [];
    
    //少了的id,获取tr元素并隐藏
    var less = compare(listA, mapB, function(id){
        var tr = document.getElementById(id);
        tr.style.display = "none";
    });
    
    //多出来了的id
    var more = compare(listB, mapA);
    var span = document.getElementById(spanId);  //spanId 自己填写
    span.innerHTML = more.join(",");
}

//调用
update([1,2,3,4,5,6,7,8,9,10], [1,3,4,5,6,7,8,12]);

------解决方案--------------------
我就贴AjAx请求数据的代码:
前台代码(自己写一个按钮调用函数):
function clickEvent()
{
var str="AJAX";//要往后台发送的字符串,可以传第你的请求参数
var xmlhttp;
if (window.XMLHttpRequest)// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
else
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)//表示提交已完成
{
alert(xmlhttp.responseText);//弹出从后台传递过来的值
}
}
xmlhttp.open("post","other.aspx?str="+str+"&type=code",true);//str为传递的字符串,type为设置的标志
xmlhttp.send();
}
后台代码:
protected void Page_Load(object sender, EventArgs e)
{
if (Request.QueryString["type"] == "code")//根据在url中设置的标志判断是否是匹配的回传
{
string theString = Request.QueryString["str"];//theString即获取到的字符串,即前台上传的
string codes="1,2,3,4,5";//要写往前台的字符串,你可以调自己的方法获取
Response.Write(codes);//将获取到的字符串再写往客服端
Response.End();
}