js改变input里的属性 style

最新推荐文章于 2022-07-29 10:43:26 发布
最新推荐文章于 2022-07-29 10:43:26 发布
阅读量4.1k 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： web前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/linwei_hello/article/details/12782097
本文介绍如何使用JavaScript禁用按钮以防止重复提交，并展示如何更改元素的颜色样式。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

document.getElementById(obj).style.color="#ff0000";   style.className="新样式名


			document.getElementById("btn_submit").disabled = true;";  button 提交后不可再次提交


                

        

    

    
  



    



                



	

		

			

				
					
JS 改变input 输入框样式

				
			

			

				

					weixin_34404393的博客
				

				

					03-10
					
					2635
					
				

			

		

		

			
				

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

			
		

	



                

            
              



	

		

			

				
					
【转】input输入框的各种样式

				
			

			

				

					weixin_30821731的博客
				

				

					05-05
					
					1万+
					
				

			

		

		

			
				
输入框景背景透明：<input style="background:transparent;border:1px solid #ffffff">
鼠标划过输入框，输入框背景色变色：<INPUT value="Type here" NAME="user_pass" TYPE="text" SIZE="29" onmouseover="this.style.borderColor=...

			
		

	



              


  
              

                


	

		

			

				
					
js 设置style样式 input框颜色 border

				
			

			

				

					我的博客
				

				

					04-20
					
					3万+
					
				

			

		

		

			
				
[0]很重要 = 。=$('#name')[0].style.border="1px solid red";$('#password')[0].style.border="1px solid red"; $('#btnLogin').on('click', function () {
        $.ajax({
            url: "/login",
            t...

			
		

	





	

		

			

				
					
Input属性详解

				
			

			

				

					qq_48621951的博客
				

				

					07-29
					
					1万+
					
				

			

		

		

			
				
注意radio（单选框）需要value值相等才可以实现单选的功能，value值可以随意设。（1）当inputtype=“text”、“password”、"hidden"时，定义输入字段的初始值；（2）当inputtype=“button”、“reset”、"submit"时，定义按钮上的显示的文本；（3）当inputtype=“checkbox”、“radio”、"image"时，定义与输入相关联的值；1.name属性元素的名称，也就是name的值代表当前input元素的名字；...

			
		

	



		

			
		



	

		

			

				
					
input输入框的各种样式

				
			

			

				

					weixin_34010566的博客
				

				

					01-02
					
					365
					
				

			

		

		

			
				
输入框景背景透明：


1 <input style="background:transparent;border:1px solid #ffffff">


鼠标划过输入框，输入框背景色变色： 



1 <INPUT value="Type here" NAME="user_pass" TYPE="text" SIZE="29" onmouseove...

			
		

	





	

		

			

				
					
原生js实现改变随意改变div属性style的名称和值的结果

				
			

			

				

					10-26
				

			

		

		

			
				
总结一下，无论是使用原生JavaScript还是jQuery，改变HTML元素的样式属性都是通过访问元素的`style`属性或使用`.css()`方法来实现的。这种灵活性使得我们可以根据用户的交互动态地更新页面的外观。同时，原生...

			
		

	





	

		

			

				
					
jQuery实现随意改变div任意属性的名称和值(部分原生js实现)

				
			

			

				

					10-27
				

			

		

		

			
				
在给定的文件中，所描述的核心知识点是如何使用原生JavaScript和jQuery来动态地改变一个HTML元素（例如div）的属性。这种技术可以使网页具有更加丰富的交互性。以下详细说明该知识点：  ### 原生JavaScript实现 在...

			
		

	





	

		

			

				
					
JavaScript动态改变div属性的实现方法

				
			

			

				

					10-23
				

			

		

		

			
				
JavaScript中动态改变div的样式属性可以通过直接操作元素的style对象属性来实现。在本文示例中，通过循环遍历了所有的input元素，并为它们绑定了一个点击事件。在这个点击事件的函数中，首先判断当前input元素是否是...

			
		

	





	

		

			

				
					
js动态修改input输入框的type属性(实现方法解析)

				
			

			

				

					10-26
				

			

		

		

			
				
在JavaScript中，动态修改`<input>`元素的`type`属性是一个常见的需求，特别是在创建交互式表单或实现特定功能时。然而，需要注意的是，并非所有浏览器都支持直接通过JavaScript修改`type`属性，尤其是对于`<input>`...

			
		

	





	

		

			

				
					
用JS动态改变表单form里的action值属性的两种方法

				
			

			

				

					12-28
				

			

		

		

			
				
方法1：   <form id=form1 name=form1 method=post action=../news/index.asp>      <td height=28><input name=keyword type=text style=width:150px id=keyword/>      <td height=28

			
		

	





	

		

			

				
					
<input>的style的特色，你知道多少？

				
			

			

				

					amber_2016的博客
				

				

					11-09
					
					396
					
				

			

		

		

			
				
年年岁岁花相似，岁岁年年人不同，人在变，岁月何尝不是（哈哈，又文艺一把）。每天看似相似，却又有着不同，今天绝对不是昨天的重复，每天都是新的一天，有不同的感受、不同的心情，发生不同的事情。哈哈，每个周一既是精力最充沛的一天、也是最惆怅的一天......
干正事、干正事，正事才是正道，好吧，本应该上周五完成的，拖到今天，想想就觉得自己在慢性自杀,此处省略一万字......
------...

			
		

	





	

		

			

				
					
Input属性

				
			

			

				

					菜小菜吃菜的博客
				

				

					04-18
					
					368
					
				

			

		

		

			
				
value 属性规定输入字段的初始值。


readonly 属性规定输入字段为只读（不能修改）。readonly 属性不需要值。它等同于 readonly="readonly"。


disabled 属性规定输入字段是禁用的。被禁用的元素是不可用和不可点击的。被禁用的元素不会被提交。disabled
 属性不需要值。它等同于 disabled="disabled"。


s

			
		

	





	

		

			

				
					
input标签的各种属性

				
			

			

				

					weixin_44540343的博客
				

				

					07-18
					
					6177
					
				

			

		

		

			
				
1、type属性
name属性 ：元素的名称；这个不需要多解释了，也就是name的取值代表为当前input元素起个名字；
size属性 ：元素的宽度；很多人都知道在HTML中，常见的宽度是用 width 表示的，而在input中 width 属性只使用与 type=“image” 时使用，input元素的宽度需要通过size属性来设定，size的值为数字，数字越大input元素越长，数字越小inp...

			
		

	





	

		

			

				
					
input标签属性详解大全

					
热门推荐

				
			

			

				

					_吉尔伽美什
				

				

					05-09
					
					7万+
					
				

			

		

		

			
				
我们先来了解一下input标签的几个基本控制属性。

name属性：元素的名称，也就是name的值代表当前input元素的名字；
value属性：元素的默认值
1）当input type=“text”、“password”、"hidden"时，定义输入字段的初始值；
2）当input type=“button”、“reset”、"submit"时，定义按钮上的显示的文本；
3）当input typ...

			
		

	





	

		

			

				
					
input标签属性简述

				
			

			

				

					不负韶话
				

				

					07-07
					
					3万+
					
				

			

		

		

			
				
一、input标签属性介绍



input标签有许多属性，如：type,name,id,value，style等



name属性：表示元素的名称，也就是name的值代表当前input元素的名字；
	id属性：用于css引用或者其他引用
	value属性：表示当前input框内显示的文字
	style属性：用于设置css样式。如颜色，背景色等
	type属性:用于设置输入框的类型，最重要的属性


如图：





以上属性中，type属性最重要，接下来讲解其type属性。



二、input标签的t

			
		

	





	

		

			

				
					
js修改input file标签样式

				
			

			

				

					小青蛙的博客
				

				

					03-23
					
					3601
					
				

			

		

		

			
				
在进行文件上传得过程中，通常需要用到input file 标签，但是由于其默认的表单元素丑陋的外观，你们是不是非常地想吐槽，想大刀阔斧地修改成你自己的所需要的样式呢？ 今天我在做上传的时候，也遇到了这个问题，真心太丑，和周围的其他表单元素，完全是格格不入啊。于是就想深入学习了解下，然后找到了一个比较简单的方法。其实很简单，就是通过label标签与input标签绑定，隐藏input标签，给label...

			
		

	





	

		

			

				
					
style的一些属性介绍

				
			

			

				

					xvzhengyang的博客
				

				

					03-09
					
					690
					
				

			

		

		

			
				
style
name="AppTheme.NoActionBar">


item
name="colorPrimaryDark">@color/colorPrimaryDarkitem>

item
name="colorAccent">@color/colorAccentitem>


item
name="android:windowBackground">@colo

			
		

	





	

		

			

				
					
关于input style属性兼容性问题

				
			

			

				

					. 
				

				

					05-21
					
					4737
					
				

			

		

		

			
				
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script>
	window.onload = function(){
 //当修改input的style的属性的时候在ie6 ie7 ie8存在兼容性的问题
//当input元素还未插入文档流之前，是可以修改它的值的，在ie和ff下都没问题。但如果input已经存在于页面，
//其type属性在ie下就成了只读属性了，不可以修改。在ff下仍是可读写属性。
   var olnp

			
		

	





	

		

			

				
					
html给input添加边框,html input怎么设置虚线边框样式

				
			

			

				

					weixin_35693423的博客
				

				

					07-02
					
					6454
					
				

			

		

		

			
				
html input设置虚线边框的方法：在input标签中使用style属性，添加“border-style: dashed;”或者“border:宽度值 dashed 颜色值;”样式；属性值dashed用于定义一个虚线边框。本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。html input设置虚线边框样式效果图：说明：1、html style...

			
		

	





	

		

			

				
					

				
			

			

				

					
				

			

		

		

			
				

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

  
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值