JS 改变input 输入框样式

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Change.html</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
  <script language="javascript">
     function test4(event) {
	   if(event.value == "11") {
	      //??div1
	      //var div1 = document.getElementById(‘div1‘);
		  var div1 = document.getElementById("div1");
		  var div2 = document.getElementById("div2");
	      div1.style.backgroundColor="black";
		  div2.disabled = true;
		  div2.readOnly = true;
	   }
	   if(event.value == "22") {
	      //??div1
	      //var div1 = document.getElementById(‘div1‘);
		  var div1 = document.getElementById("div1");
		  var div2 = document.getElementById("div2");
	      div1.style.backgroundColor="red";
		   div2.disabled = false;
		   div2.readOnly = false;
	   }
	 }
  </script>
</head>
<body>
  <!--<div id="div1" style="width:400px; height:300px; background-color:red;">div1</div>-->
  <div id="div1" style="width:400px; height:300px; background-color:red;">div1</div>
  <input type="text" id="div2" value=""/>
  <input type="button" value="11" onclick="test4(this)"/>
  <input type="button" value="22" onclick="test4(this)"/>

  </body>
</html>

不配图,复制代码一运行就能知道

时间: 2024-12-17 23:22:47

JS 改变input 输入框样式的相关文章

js 验证input 输入框

<h1>js验证输入框内容</h1><br /><br /> 只能输入英文<input type="text" onkeyup="value=value.replace(/[^a-zA-Z]/g,'')"><br /><br />只能输入英文<input type="text" onkeyup="value=value.replace(/[^\a-

改变input 按钮 样式

改变按钮有以下两种方式: 1,直接在元素上定义样式,代码如下: <input type="button"  id="searchUser" style="width:124px;text-align:center;" value="查询坐席" onclick="searchUser()"/> 2,使用css控制,给按钮添加一个类名,如: <input type="button&q

js实现input输入框只能输入数字的功能(完美测试通过)

<input type="text" style="ime-mode:disabled;" onpaste="return false;" onkeypress="keyPress()" /> function keyPress() { var keyCode = event.keyCode; if ((keyCode >= 48 && keyCode <= 57)) { event.r

【JS】input输入框只能输入数字

一.实现思路 input只能输入纯数字的思路其实很简单,监听输入框值的变化,每次输入检索输入框的值,将非数字的字段替换成空,再将此值赋予给输入框. 关键代码: \d:匹配数字 ^/d:全文匹配非数字 replace(/[^/d]/g,''):全文匹配非数字,并替换成空. 那我们的实现代码为: var input = document.querySelector("#demo"); input.oninput = function (){ input.value = input.valu

Html+js 控制input输入框提示

<input type="text" class="fl plsearch_txt" id="key" value="请输入关键字" onfocus="javascript:if(this.value=='请输入关键字') this.value='';" onblur="javascript:if(this.value=='') this.value='请输入关键字';">

js实现input输入框只能输入数字的功能

1 <input type="text" style="ime-mode:disabled;" onpaste="return false;" onkeypress="keyPress()" /> 2 3 function keyPress() { 4 var keyCode = event.keyCode; 5 if ((keyCode >= 48 && keyCode <= 57))

JS中input输入框的一些限制

限制只能输入正整数 <input type="text" onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1

css改变input输入框placeholder值颜色

::-webkit-input-placeholder { /* WebKit browsers */ color: #fff; } :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #fff; opacity: 1; } ::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #fff; opacity: 1; } :-ms-input-placeholder { /* Inte

用JS改变的元素CSS样式

CSS样式的引用有3种方式:style引用.class引用.id引用,所以js改变元素的样式我们也分3种来说. 1.js改变由style方式引用的样式:方法一:document.divs.style.cssText="border:1px solid #000000;color:#FF0000";方法二:document.divs.setAttribute("style","border:1px solid #000000;color:#FF0000&qu