html+js实现文本框背景及只读属性修改

最新推荐文章于 2022-09-15 17:24:26 发布

无知的幸福zc

最新推荐文章于 2022-09-15 17:24:26 发布

阅读量2.7k

点赞数

分类专栏： javascript 文章标签： html

本文链接：https://blog.csdn.net/zc1107473010/article/details/46881379

版权

javascript 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

因为工作需求接触了html+js，发现了这是一个很神奇的领域，宽松的语法要求，超文本类现实的输出语言，对于主要学习C语言的我感觉特别新奇。

默认：

选择第二个radio：

具体实现的功能是选中对应的文本框背景色变为白色，内容可读写，而没有选中的文本框背景变蓝色，内容只读；

考虑到只能同时选择一个，所以前面用radio，具体代码实现如下(因为是自学的，所以代码只是我理解实现的，不一定是好代码)：

<pre><html>
<head>
<title>Set parameters</title>
<meta http-equiv="Content-Type" content="text/html">

<script LANGUAGE="JavaScript">

var check1_number = 0;

function setbackgroundcolor(id,value)
{
  switch(value)
  {
    case 1:
      document.getElementById(id).style.backgroundColor = "#99CCDD";
    break;
    case 2:
      document.getElementById(id).style.backgroundColor = "#FFFFFF";
    break;
    default:
    break;
  }
}

function checkstatus(radioname,speedname)
{
  var cname = document.getElementsByName(radioname);
  var sname = document.getElementsByName(speedname);
  for(var i=0; i<cname.length; i++)
  {
    if(cname[i].checked)
    {
      sname[i].value = 1;
      sname[i].readOnly = false;
      setbackgroundcolor(sname[i].id,2);
    }
    else
    {
      sname[i].value = 0;
      sname[i].readOnly = true;
      setbackgroundcolor(sname[i].id,1);
    }
  }
}

function setcheck(radioname,speedname,num)
{
  var cname = document.getElementsByName(radioname);
  for(var i=0; i<cname.length; i++)
  {
    if(i == num)
    {
      cname[i].checked = "checked";
    }
    else
    {
      cname[i].checked = "";
    }
  }
  checkstatus(radioname,speedname);
}
function AutoRun()
{
  setcheck('checkone','onespeed', check1_number);
}
</script>
</head>

<body bgcolor="#FFFFFF" οnlοad="AutoRun();">
          <input id="64KR1C" type="radio" name="checkone" onClick="return checkstatus('checkone','onespeed')" >
          <input id="64KR1" type="text" name="onespeed" size="6" maxlength="6"  value="1">   
          <input id="1MR1C" type="radio" name="checkone"  onClick="return checkstatus('checkone','onespeed')">
          <input id="1MR1" type="text" name="onespeed" size="6" maxlength="6"  value="1">   
          <input id="100MR1C" type="radio" name="checkone" onClick="return checkstatus('checkone','onespeed')">
          <input id="100MR1" type="text" name="onespeed" size='6' maxlength="6"  value="1">   
</body>
</html></pre>