html设置input输入内容等

简介:     通过html网页,有时候跟CGI或者其它的中介交互,可以实现一些简单的设置功能。避免设计windows软件的繁琐。     本例展示html中的input表单的几个常用方法。
    通过html网页,有时候跟CGI或者其它的中介交互,可以实现一些简单的设置功能。避免设计windows软件的繁琐。     本例展示html中的input表单的几个常用方法。 图1、案例效果图   一、实现input的转入数字的限制     图1是一个简单页面,现在要求红色区域输入的数字在2~6550范围,如何处理? 1、设置该input的属性     需要给该input一个id,并创建一个onChange事件。 2、编写javascrit小脚本 function dataInput() {     var inputValue = (document.getElementById("unitId").value);     if(inputValue 6550)         document.getElementById("unitId").value = 6550; }     html提供了一个专业的函数getElementById。   二、如何限制input-text的输入字符串的长度 maxlength="4"     input表单有一个专门的属性,maxlength就可以解决问题。   附-案例完整代码 NETWORK          function dataInput()     {         var inputValue = (document.getElementById("unitId").value);         if(inputValue 6550)             document.getElementById("unitId").value = 6550;                  }                    
      
		
		
			     

    Setting       
                   

         

ID                                     ( Range of unit ID : 2~6550 )         
IP                       .                          .                          .                      
Netmask                             .                          .                          .                  
Getway                            .                          .                          .                          
Device type                                      A                     B                     C                              
        
                                         
         
       
相关文章
|
前端开发
用html+javascript打造公文一键排版系统3:获取参数设置、公文标题排版
用html+javascript打造公文一键排版系统3:获取参数设置、公文标题排版
|
11月前
|
Web App开发 移动开发 iOS开发
HTML5 新的 Input 类型6
`<input type="url">` 用于需要输入 URL 的表单字段,浏览器会自动验证输入是否为有效网址
|
11月前
|
Web App开发 移动开发 iOS开发
HTML5 新的 Input 类型5
HTML5 引入了多种新的输入类型,以增强用户体验和数据验证。`<input type="tel">` 用于输入电话号码;`<input type="time">` 允许用户选择时间(不带时区);`<input type="url">` 用于输入网址,支持自动验证。这些输入类型在不同浏览器中的支持情况有所不同,但大多数现代浏览器均能良好支持。例如,在 iPhone 的 Safari 浏览器中,使用 `url` 类型时,键盘会特别显示 `.com` 按钮以方便输入。
|
11月前
|
移动开发 HTML5
HTML5 新的 Input 类型2
`<input>` 标签提供多种类型以满足不同需求:`datetime` 类型用于选择 UTC 时间的日期和时间;`datetime-local` 类型用于选择不带时区的日期和时间;`email` 类型则确保输入的是有效的电子邮件地址,适用于需要收集用户邮箱信息的场景。
|
11月前
|
移动开发 HTML5
HTML5 新的 Input 类型3
`<input type="month">` 允许用户选择一个月份,适用于需要指定月份和年的场景。示例:生日 (月和年)。 `<input type="number">` 用于需要数值输入的场合,可设置数值范围等限制。示例:数量 (1 到 5 之间)。支持 `disabled`, `max`, `min` 等属性以增强功能。
|
11月前
|
Web App开发 移动开发 iOS开发
HTML5 新的 Input 类型1
HTML5引入了多种新的输入类型,如color、date、email等,增强了表单的输入控制与验证功能。尽管并非所有浏览器都完全支持,但这些新类型仍可在主流浏览器中使用,不支持时会退化为普通文本输入。例如,`<input type="color">`允许用户通过颜色选择器选取颜色,而`<input type="date">`则提供了一个日期选择器来方便用户选择日期。
|
移动开发 数据安全/隐私保护 UED
HTML5 新的 Input 类型详解
HTML5引入了多种新输入类型,显著提升了表单的用户体验和可用性。这些类型包括普通文本、搜索、电子邮件、网址、电话号码、密码、数字、范围选择、日期、时间、颜色选择等,每个类型都有特定用途和优化功能。例如,`email` 类型可自动验证邮件格式,`number` 类型提供增减按钮,而 `date` 类型则内置日期选择器。这些新类型不仅简化了用户操作,还增强了开发者对表单验证和数据交互的控制能力。
|
移动开发 前端开发 JavaScript
HTML5 新的 Input可以有哪些好玩的应用
HTML5的新输入类型为应用带来了多种创新和互动功能,显著提升了用户体验和界面趣味性。例如,颜色选择器可动态改变网站主题色;滑块控制适用于音量或亮度调节;日期和时间输入便于预约系统的设计;互动式表单结合多种输入类型实现高效的数据收集;猜数字游戏增加用户参与度;实时搜索建议优化网站搜索功能;图像预览功能让用户上传图片前预览效果;密码可见性切换按钮提升表单的可用性;结合用户位置的电话号码输入则能提供附近服务信息。这些应用场景不仅使网站更具吸引力,还增强了用户的互动体验。
|
11月前
|
移动开发 HTML5
HTML5 新的 Input 类型4
`range` 类型的输入域用于需要在一定范围内选择数值的情况,通常以滑动条形式展示。
|
前端开发
HTML+CSS基础知识(6)背景的设置、表格的设计、表单的设计和框架集
这篇文章详细介绍了如何在HTML和CSS中设置背景、设计表格、创建表单以及使用框架集,并通过代码示例和测试结果展示了具体的实现方法和效果。
HTML+CSS基础知识(6)背景的设置、表格的设计、表单的设计和框架集