jquery 添加和移除节点 jquery 的简单实例应用

最新推荐文章于 2018-05-23 22:20:04 发布

最新推荐文章于 2018-05-23 22:20:04 发布 · 98 阅读

文章标签：

#jQuery #J# #PHP #ViewUI

本文介绍了一个图书馆搜索系统，用户可以根据城市、图书类别和关键词进行搜索。系统支持选择不同城市的图书馆并查看其馆藏书目，提供关键词搜索功能，并允许用户通过筛选条件获取所需信息。

代码

var allSchool = new Array();
var clickCity = "";
var citys = [
    {city:"北京市",
    libs:[
    {name:"北京工业201大学馆藏书目",vals:"201"},
    {name:"北京工业202大学馆藏书目",vals:"202"}
    ]
    },
    {city:"天津市",
    libs:[
    {name:"天津工业203大学馆藏书目",vals:"203"},
    {name:"天津工业204大学馆藏书目",vals:"204"}
    ]
    }
];

$(document).ready(function(){
$("#BtKeySearch").bind("click",function (){
var keywords =$("#idKeyword").val();
var searchtype =getSelect("column");
var searchmodel  = getSelect("condition");
//var schooltype=getSelect("libs");
var schooltype=getSelect("selectedLibs");
$.cookie('the_libs', schooltype, { expires: 7 });
alert("do.php?"+"keywords="+keywords+"&sourcetype="+searchtype+"&searchtype="+searchmodel+"&searchmodel=1&sort=1&schooltype="+schooltype+"&page=1");

})
$("#advanceSearch").bind("click",function(){
var idSpanSearch = document.getElementById("idSpanSearch");
idSpanSearch.style.display="block";
})

})
function getSelect(names)
{
    var vals = "";
    var eles = document.getElementsByName(names);
    for(var i=0;i<eles.length;i++)
    {
    if(eles[i].checked)
    vals+=eles[i].value+",";
    }
    vals = vals.length>0?(vals.substring(0,vals.length-1)):("");
return vals;
}
//改变库
function changeVal(temp)
{
clickCity=temp;
  var library = "";
for(var i=0;i<citys.length;i++)
{
//判断城市
if(citys[i].city==temp)
{
   //寻找书库
  for(var j=0;j<citys[i].libs.length;j++)
  {
    var state =false;
     for(var k=0;k<allSchool.length;k++)
     {
         if(allSchool[k]==citys[i].libs[j].vals)
         {
         state=true;
         break;
         }
     }
     if(!state)
  library +="<li><input type='checkbox' name='libs' onclick='if(this.checked)appendHtml(\""+citys[i].libs[j].name+"\",\""+citys[i].libs[j].vals+"\",0);$(this).parent().remove();' value='"+citys[i].libs[j].vals+"'/>"+citys[i].libs[j].name+"</li>";
  }
  break;
// 查找到跳出
}
}
$("#libs").html(library);
}
//追加文本
function appendHtml(text,values,type)
{

    for(var i=0;i<allSchool.length;i++)
    {
    if(values==allSchool[i])
    return;
    }
    if(type=="0")
  $("#idSelectedSchool").append("<li title=\""+text+"\"><input type=\"checkbox\" onclick=\"removeArray('"+values+"',0);$(this).parent().remove();\"  name=\"selectedLibs\"  checked=\"checked\" value=\""+values+"\"/>"+text+"</li>")
  else
  $("#idSelectedSchool").append("<li title=\""+text+"\"><input type=\"checkbox\" onclick=\"removeArrayDian('"+text+"','"+values+"');$(this).parent().remove();\"  name=\"selectedLibs\"  checked=\"checked\" value=\""+values+"\"/>"+text+"</li>")
  allSchool.push(values);
}
//改变样式
function changeClass(classid)
{
for(var i=0;i<22;i++)
{
   $("#city00"+i.toString()).attr("class"," ");
}
  $("#"+classid).attr("class","selected");
}
//移除记录的值
function removeArray(val,type)
{
var tempArr = new Array();
for(var i=0;i<allSchool.length;i++)
{
if(allSchool[i]!=val)
{
tempArr.push(allSchool[i]);
}
}
allSchool=tempArr;
//如果是一个城市添加下面的项

if(type=="0")
{
     for(var i=0;i<citys.length;i++)
     {
     //判断城市
         if(citys[i].city==clickCity)
         {
           //寻找书库
              for(var j=0;j<citys[i].libs.length;j++)
              {
                  if(val==citys[i].libs[j].vals)
                  {
                   $("#libs").append("<li><input type='checkbox' name='libs' onclick='if(this.checked)appendHtml(\""+citys[i].libs[j].name+"\",\""+citys[i].libs[j].vals+"\",0);$(this).parent().remove();' value='"+citys[i].libs[j].vals+"'/>"+citys[i].libs[j].name+"</li>");
                  break;
                  }
              }
              break;
              // 查找到跳出
         }
     }
}
else
{
var tempArr = new Array();
for(var i=0;i<allSchool.length;i++)
{
if(allSchool[i]!=val)
{
tempArr.push(allSchool[i]);
}
}
allSchool=tempArr;
   $("#idDianziQiKuan").append("<li><input type='checkbox' name='libs' onclick='if(this.checked)appendHtml(\""+citys[i].libs[j].name+"\",\""+citys[i].libs[j].vals+"\",1);$(this).parent().remove();' value='"+citys[i].libs[j].vals+"'/>"+citys[i].libs[j].name+"</li>");
}

}
function removeArrayDian(text,value)
{
  $("#idDianziQiKuan").append("<li><input type='checkbox' name='libs' onclick='if(this.checked)appendHtml(\""+text+"\",\""+value+"\",1);$(this).parent().remove();' value='"+value+"'/>"+text+"</li>");
}
function displayDiv(obj)
{
document.getElementById(obj).style.display=document.getElementById(obj).style.display=="block"?("none"):("block");
}