当前位置: 代码迷 >> JavaScript >> js 惯用方法
  详细解决方案

js 惯用方法

热度:69   发布时间:2013-10-11 14:52:39.0
js 常用方法

1 清空填写项

//清空查询信息
function toClear(){
	
	toClearType("input", "text");//input	
	toClearType("textarea", "textarea");//textarea	
	toClearType("select", "");//select	
}


//input textarea
function toClearType(tagName, tagType){
       var sum=0;
       var t = document.getElementsByTagName(tagName);
	   if (tagName == "select") {
            for (var i=0; i <t.length;i++){                  
		      		++sum;
		      		t[i].value="";//清空 		      
            }
	    }else {
            for (var i=0; i <t.length;i++){  
                if (t[i].type==tagType){  
		      		++sum;
		      		t[i].value="";//清空 
		      	}
            }
	    }
		//alert('页面共有' + tagName + ':'+sum + ' 个');
}

2  转:select控件大全(新增、修改、删除、选中、清空、判断存在等)

判断select选项中 是否存在Value="paraValue"Item 
 2 
select选项中 加入一个Item 
 3
select选项中 删除一个Item 
 4
删除select中选中的项 
 5
修改select选项中 value="paraValue"text"paraText" 
 6
设置selecttext="paraText"的第一个Item为选中 
 7
设置selectvalue="paraValue"Item为选中 
 8
得到select的当前选中项的value 
 9
得到select的当前选中项的text 
 10
得到select的当前选中项的Index 
 11
清空select的项 

js 代码

// 1.判断select选项中 是否存在Value="paraValue"的Item        
function jsSelectIsExitItem(objSelect, objItemValue) {        
    var isExit = false;        
    for (var i = 0; i < objSelect.options.length; i++) {        
        if (objSelect.options[i].value == objItemValue) {        
            isExit = true;        
            break;        
        }        
    }        
    return isExit;        
}         
   
// 2.向select选项中 加入一个Item        
function jsAddItemToSelect(objSelect, objItemText, objItemValue) {        
    //判断是否存在        
    if (jsSelectIsExitItem(objSelect, objItemValue)) {        
        alert("该Item的Value值已经存在");        
    } else {        
        var varItem = new Option(objItemText, objItemValue);      
        objSelect.options.add(varItem);     
        alert("成功加入");     
    }        
}        
   
// 3.从select选项中 删除一个Item        
function jsRemoveItemFromSelect(objSelect, objItemValue) {        
    //判断是否存在        
    if (jsSelectIsExitItem(objSelect, objItemValue)) {        
        for (var i = 0; i < objSelect.options.length; i++) {        
            if (objSelect.options[i].value == objItemValue) {        
                objSelect.options.remove(i);        
                break;        
            }        
        }        
        alert("成功删除");        
    } else {        
        alert("该select中 不存在该项");        
    }        
}    
   
   
// 4.删除select中选中的项    
function jsRemoveSelectedItemFromSelect(objSelect) {        
    var length = objSelect.options.length - 1;    
    for(var i = length; i >= 0; i--){    
        if(objSelect[i].selected == true){    
            objSelect.options[i] = null;    
        }    
    }    
}      
   
// 5.修改select选项中 value="paraValue"的text为"paraText"        
function jsUpdateItemToSelect(objSelect, objItemText, objItemValue) {        
    //判断是否存在        
    if (jsSelectIsExitItem(objSelect, objItemValue)) {        
        for (var i = 0; i < objSelect.options.length; i++) {        
            if (objSelect.options[i].value == objItemValue) {        
                objSelect.options[i].text = objItemText;        
                break;        
            }        
        }        
        alert("成功修改");        
    } else {        
        alert("该select中 不存在该项");        
    }        
}        
   
// 6.设置select中text="paraText"的第一个Item为选中        
function jsSelectItemByValue(objSelect, objItemText) {            
    //判断是否存在        
    var isExit = false;        
    for (var i = 0; i < objSelect.options.length; i++) {        
        if (objSelect.options[i].text == objItemText) {        
            objSelect.options[i].selected = true;        
            isExit = true;        
            break;        
        }        
    }              
    //Show出结果        
    if (isExit) {        
        alert("成功选中");        
    } else {        
        alert("该select中 不存在该项");        
    }        
}        
   
// 7.设置select中value="paraValue"的Item为选中    
document.all.objSelect.value = objItemValue;    
       
// 8.得到select的当前选中项的value    
var currSelectValue = document.all.objSelect.value;    
       
// 9.得到select的当前选中项的text    
var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;    
       
// 10.得到select的当前选中项的Index    
var currSelectIndex = document.all.objSelect.selectedIndex;    
       
// 11.清空select的项    
document.all.objSelect.options.length = 0;   

Jquery操作select

//得到select项的个数   
   jQuery.fn.size = function(){   
       return jQuery(this).get(0).options.length;   
   }   
   
   //获得选中项的索引   
   jQuery.fn.getSelectedIndex = function(){   
       return jQuery(this).get(0).selectedIndex;   
   }   
  
  //获得当前选中项的文本   
  jQuery.fn.getSelectedText = function(){   
      if(this.size() == 0) return "下拉框中无选项";   
      else{   
          var index = this.getSelectedIndex();         
          return jQuery(this).get(0).options[index].text;   
      }   
  }   
  
  //获得当前选中项的值   
  jQuery.fn.getSelectedValue = function(){   
      if(this.size() == 0)    
          return "下拉框中无选中值";   
         
      else 
          return jQuery(this).val();   
  }   
  
  //设置select中值为value的项为选中   
  jQuery.fn.setSelectedValue = function(value){   
      jQuery(this).get(0).value = value;   
  }   
  
  //设置select中文本为text的第一项被选中   
  jQuery.fn.setSelectedText = function(text)   
  {   
      var isExist = false;   
      var count = this.size();   
      for(var i=0;i<count;i++)   
      {   
          if(jQuery(this).get(0).options[i].text == text)   
          {   
              jQuery(this).get(0).options[i].selected = true;   
              isExist = true;   
              break;   
          }   
      }   
      if(!isExist)   
      {   
          alert("下拉框中不存在该项");   
      }   
  }   
  //设置选中指定索引项   
  jQuery.fn.setSelectedIndex = function(index)   
  {   
      var count = this.size();       
      if(index >= count || index < 0)   
      {   
          alert("选中项索引超出范围");   
      }   
      else 
      {   
          jQuery(this).get(0).selectedIndex = index;   
      }   
  }   
  //判断select项中是否存在值为value的项   
  jQuery.fn.isExistItem = function(value)   
  {   
      var isExist = false;   
      var count = this.size();   
      for(var i=0;i<count;i++)   
      {   
          if(jQuery(this).get(0).options[i].value == value)   
          {   
              isExist = true;   
              break;   
          }   
      }   
      return isExist;   
  }   
  //向select中添加一项,显示内容为text,值为value,如果该项值已存在,则提示   
  jQuery.fn.addOption = function(text,value)   
  {   
      if(this.isExistItem(value))   
      {   
          alert("待添加项的值已存在");   
      }   
      else 
      {   
          jQuery(this).get(0).options.add(new Option(text,value));   
      }   
  }   
  //删除select中值为value的项,如果该项不存在,则提示   
  jQuery.fn.removeItem = function(value)   
  {       
      if(this.isExistItem(value))   
      {   
          var count = this.size();           
          for(var i=0;i<count;i++)   
         {   
             if(jQuery(this).get(0).options[i].value == value)   
             {   
                 jQuery(this).get(0).remove(i);   
                 break;   
             }   
         }           
     }   
     else 
     {   
         alert("待删除的项不存在!");   
     }   
 }   
 //删除select中指定索引的项   
 jQuery.fn.removeIndex = function(index)   
 {   
     var count = this.size();   
     if(index >= count || index < 0)   
     {   
         alert("待删除项索引超出范围");   
     }   
     else 
     {   
         jQuery(this).get(0).remove(index);   
     }   
 }   
 //删除select中选定的项   
 jQuery.fn.removeSelected = function()   
 {   
     var index = this.getSelectedIndex();   
     this.removeIndex(index);   
 }   
 //清除select中的所有项   
 jQuery.fn.clearAll = function()   
 {   
     jQuery(this).get(0).options.length = 0;   
 } 
      


  相关解决方案