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

最新推荐文章于 2020-06-30 14:35:55 发布

iteye_10304

最新推荐文章于 2020-06-30 14:35:55 发布

阅读量91

点赞数

文章标签： 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 " );
}