js checkboxまとめ

27671 ワード

check box

/**
＊すべての指定された名前のcheckbox
*@state 全選択のcheckboxの状態
*@name   表のすべてのcheckboxの名前
*@author fangtf
*@type void
*/
機能 selectAll(state,name) {
    var ids = document.getElementsByName;
for (var i = 0; i < ids.length i++)
    {
            ids[i].checked = state;
    }
)

/**
＊全ての指定されたID名の同名checkbox
*@state 全選択のcheckboxの状態
*@name   表のすべてのcheckboxの名前
*@name   表の中の全てのcheckboxのid
*@author fangtf
*@type void
*/
機能 selectAll Checkbox ByID(state、name、id) {
    var ids = document.getElementsByName;
for (var i = 0; i < ids.length i++)
    {
if(ids[i].id == id)
            {
                ids[i].checked = state;
            }

    }
)

/**
＊全選択ページのすべてのcheckbox
*@state 全選択のcheckboxの状態
*@author fangtf
*@type void
*/
機能 selectAlls(state)
{
    var input = Dcument.getElements ByTagName;
for(var) i =0;i
    {
if(input[i].type == 「checkbox」)
        {
            input[i].checked =state;
        }
    }

)

/**
*マウスでクリックした行を得る
*@type Object
*/
機能 GetRow(oElem) {
while (oElem) {
if (oElem.tagName.toLowerCase() == tr && oElem.parentElement.tag Name.toLowerCase() == 「tbody」) {
return oElem;
        }
if (oElem.tagName.toLowerCase() == 「テーブル」 || oElem.tagName.toLowerCase() == 「th」) {
return false;
        }
        oElemolem = oElem.parentElement;
    }
)

/**
＊現在の行のチェックボックスを選択します.
*@state 全選択のcheckboxの状態
*@author fangtf
*@type void
*/
機能 selectRowCheckbox(state)
{
  var row = GetRow(window.event.srculement)
  var セル = row.childNodes
for(var) i=0;i
  {
      var セル = エクセル[i].childNodes[0];
if(cel.tag Name) == 「INPUT」)
     {
        cell.checked = state;
     }
  }
)

/**
*指定値のRadioを選択
*如:二つのラジオがあります.
*最初のname=「ids」、value=「1」
*2番目のname=「ids」、value=「2」
*呼び出し方法selectRadio(「ids」「1」)
*では、1の数値のRadioが選択されます.
*@name ラジオの名前
*@value ラジオの値
*@author fangtf
*@type void
*/
機能 selectRadio(name,value) {
    var radioObject = document.getElementsByName;
if(value) === 「」)
    {
        radioObject[0].checed = true;
return;
    }
for (var i = 0; i < radioObject.length i++)
    {
if(radio Object[i].value == value)
        {
            radioObject[i].checed = true;
break;
        }

    }
)

/**
＊指定値のチェックボックスを選択する
＊如:checkboxが二つあります.
*最初のname=「ids」、value=「1」
*2番目のname=「ids」、value=「2」
*3番目のname=「ids」、value=「3」
*このメソッドを呼び出すとselect Checkbox(「ids」「1,2」)の値が1,2のチェックボックスが選択されます.
＊
*@name 選択するcheckbox配列の名前
*@value 判定時に選択した値
*@author fangtf
*@type void
*/
機能 select Checkbox(name、value) {
    var check Object = document.getElementsByName;
    var valuevalues = value.split(",");
for(var) j = 0; j < values.length j++)
    {
for (var i = 0; i < check Object.length i++)
        {
if(checkObject[i].value == values[j]
            {
                check Object[i].checked = true;
break;
            }
        }
    }

)

/**
*指定された値のセレクトを選択します.
＊如:userというselectがあります.
＊
＊
＊この方法のselectOption(「user」、「0」)を呼び出すと、0のオプションが選択されます.
＊
*@name  String  selectの名前
*@value String  判定時に選択した値
*@author fangtf
*@type void
*/
機能 selectOption(name,value)
{
    var options = document.getElementsByName[0].options;
for (var i = 0; i < options.length i++)
    {
if(options[i].value === value)
        {
            options[i].selected = true;
break;
        }
    }

)

以上の内容はCSDNブログから来ました.転載は出所を明記してください.http://blog.csdn.net/jaketseng/archive/2009/02/18/3905733.aspx
次は例です

<html> 　　



<head> 　



　<script type="text/javascript"> 



function $(id){



return  document.getElementById(id);



}



 



String.prototype.trim = function () {



    return this.replace(/(^\s*)|(\s*$)/g, "");



};



 



/**      



*           checkbox     



*@state    checkbox        



*@name         checkbox        



*@author fangtf     



*@type void     



*/   



function selectAll(state,name) {        



    var ids = document.getElementsByName(name);        



for (var i = 0; i < ids.length; i++)         



    {               



            ids[i].checked = state;        



    }        



}   



 



 



/**      



*        id     checkbox     



*@state    checkbox        



*@name         checkbox        



*@name         checkbox id     



*@author fangtf     



*@type void     



*/   



function selectAllCheckboxByID(state,name,id) {        



    var ids = document.getElementsByName(name);        



for (var i = 0; i < ids.length; i++)         



    {               



if(ids[i].id == id)        



            {        



                ids[i].checked = state;        



            } else{



ids[i].checked = false;



}       



  



    }        



}    



 



function foo()



{



var gloal = (function(){return this;}());



    //     



    var chkObjs = document.getElementsByName("roViewType");



    var roViewTypeValue = "";



 



//selectAll(true,"roViewType");



selectAllCheckboxByID(true,"roViewType","roViewType10");



    for(var i=0,len=chkObjs.length;i<len;i++){



        if(chkObjs[i].checked){



        roViewTypeValue = chkObjs[i].value;



$('detail').value = "checkboxValue:"+ roViewTypeValue+";checkboxText: "+chkObjs[i].nextSibling.nodeValue.trim()+";   "+chkObjs[i].nextSibling.nodeValue.trim()+"    checkbox";



//$("roViewType12").disabled = true; //   



//$("detail").disabled = true; //   



//$("detailtest").disabled = false; //  



        break;



        }



    }



}



　　</script> 　



　</head> 　



　<body>



 



<div height="100px">



<fieldset>



<legend><strong>    </strong></legend>



<input type="checkbox" id="roViewType0" name="roViewType" value="0" onclick="channelInitLw()" checked="true">    



<input type="checkbox" id="roViewType9" name="roViewType" value="9" onclick="channelInitLw()">      



<input type="checkbox" id="roViewType10" name="roViewType" value="10" onclick="channelInitLw()">      



<input type="checkbox" id="roViewType1" name="roViewType" value="1" onclick="channelInitLw()">      



<input type="checkbox" id="roViewType8" name="roViewType" value="8" onclick="channelInitLw()">IPTV



<input type="checkbox" id="roViewType7" name="roViewType" value="7" onclick="channelInitLw()">CMMB



<input type="checkbox" id="roViewType6" name="roViewType" value="6" onclick="channelInitLw()"> DTMB



<input type="checkbox" id="roViewType2" name="roViewType" value="2" onclick="channelInitLw()">      



<input type="checkbox" id="roViewType11" name="roViewType" value="11" onclick="channelInitLw()">      



<br>



<input type="text" id="detail" name="qwe"  style="width: 602px"  value="    " >



<input type="button" id="roViewType12" name="buttonname" value="       " onclick="foo()">



<input type="text" id="detailtest" name="qwe"  style="width: 50px"  value="test" >



</fieldset>



</div>



 



　</body> 　　



</html>

jsオペレータの実例コード