`

一个模仿HTML5功能的jquery控件

阅读更多
原文:http://www.matiasmancini.com.ar/html5form_en.php

大致将要点翻译下:
  在HTML5中,验证输入框等都可以不用JAVASCRIPT就能实现了,现在只有少部分浏览器
支持这个功能;现在,可以使用jquery插件去模拟这个功能了。安装:
<head>
    
    //jQuery library
    <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
    
    //jQuery.html5form plugin
    <script src="http://html5form.googlecode.com/svn/trunk/jquery.html5form-min.js">
    </script>
   
    <script>
        $(document).ready(function(){
            $('#myform').html5form();   
        });
    </script>

</head>

HTML5的一些特征如下:
1)属性placeholder
  <input type="text" placeholder="Full Name"/>
placeholder的作用是,当你在文本框没输入任何东西,时,
会自动光标停留在文本框中
2)EMAIL
<input type="email" name="email" id="email"/>
3)TEXTAREA
  <textarea maxlength="60" name="comment" id="comment"/>
4) URL
  <input type="url" name="website" placeholder="http://"/>
这个表明必须输入的是url
  使用这个控件
<script>
   
    $('#myform').html5form({
       
        async : false, // cancels the default submit method.
        method : 'GET', // changes the request method.
        action : 'respuesta.php', // changes the action method.
        responseDiv : '#respuesta' // a content div to get the callback function response.
       
    })
   
</script>

5 当有多个form时
<script>

    $('#myform_one').html5form({
        method: 'POST',
    });

    $('#myform_two').html5form({
        method: 'GET'
    });

</script>

支持所有浏览器:
<script>

    $('#myform').html5form({
        allBrowsers: true
    });

</script>

下载见:
http://html5form.googlecode.com/svn/trunk/jquery.html5form-min.js
2
0
分享到:
评论

相关推荐

    jQuery手机端HTML5带农历日期选择插件jQuery移动端日历插件swiper.js

    总的来说,这款jQuery手机端HTML5日历插件充分利用了现有的前端技术,为移动应用开发提供了一个功能齐全、用户体验良好的日期选择工具。开发者可以通过定制样式和扩展功能,适应各种项目需求。无论是对于需要农历...

    jquery 移动端日期选择控件

    这个控件基于jQuery,一个广泛应用于前端开发的JavaScript库,它简化了DOM操作,事件处理和动画制作。 首先,让我们了解一下核心组件: 1. **jQuery**:jQuery是一个强大的JavaScript库,它的目标是使JavaScript...

    一个jQuery时间选择控件类似于GoogleCalendar

    "一个jQuery时间选择控件类似于Google Calendar"的标题暗示了我们要讨论的是一种能够模仿Google Calendar中时间选择功能的jQuery插件。 Google Calendar是一款广泛使用的在线日程管理应用,其时间选择器设计直观,...

    模仿OutLook垂直菜单控件

    本篇文章将深入探讨如何模仿OutLook的垂直菜单控件,并提供一个示例来帮助开发者实现类似的功能。 首先,我们要理解OutLook垂直菜单的基本特点。这个菜单通常位于窗口的左侧,包含多个主类别,如“收件箱”、“发件...

    模仿extjs风格写的jquery combobox

    标题中的“模仿extjs风格写的jquery combobox”指的是一个基于jQuery的下拉选择框组件,它的设计灵感来源于ExtJS库的ComboBox控件。ExtJS是一款功能丰富的JavaScript框架,以其强大的组件化和数据绑定机制著名,而...

    asp.net模仿Sina弹出警告窗口控件

    通过以上步骤,我们可以在ASP.NET中创建一个模仿Sina弹出警告窗口的控件。这个控件不仅可以用于警告,还可以扩展用于信息提示、确认操作等多种场景,提高网站的互动性。在实际项目中,可以将其封装成一个可重用的...

    Javascript模仿Android手机日期选择控件

    总结来说,使用JavaScript和jQuery,我们可以创建一个与Android原生日期选择器类似的控件。这个过程涉及到Date对象的使用、DOM操作、事件监听以及可能的样式和动画处理。通过这种方式,即使在非原生环境中,用户也能...

    树型控件jquery

    "树型控件jQuery"是一种在网页中呈现层次结构数据的交互式用户界面元素,它模仿了计算机操作系统中常见的文件目录结构。这种控件在网页应用中广泛使用,例如菜单系统、组织架构展示或者文件管理等场景。jQuery,一个...

    精美漂亮的实用div+css模仿select下拉框控件

    在网页设计中,`div+css`是一种常见的布局方式,用于构建页面结构和样式,而`select`控件则是HTML中的一个基础元素,通常用于创建下拉列表供用户选择。本项目通过`jq`(jQuery)库实现了对`select`控件的模仿,创建...

    美漂亮的实用div+css模仿select下拉控件

    在本项目中,“美漂亮的实用div+css模仿select下拉控件”是一个使用JavaScript(jq,即jQuery库)实现的,旨在提供一种更美观、用户体验更好的下拉选择功能。接下来,我们将详细探讨这个项目中的关键知识点。 1. **...

    模仿钉钉选择每个步骤的审核人的html代码

    这需要创建一个模态对话框或者浮动视图,包含输入控件和选择项。视图的打开和关闭可以通过事件监听和DOM操作来控制。 3. **确定按钮**:在选项视图中,用户确认选择后,点击确定按钮,应当将新节点添加到流程中。这...

    模仿淘宝分页控件

    通过以上步骤,我们可以创建一个功能完备、用户体验良好的分页控件,模仿淘宝的设计风格,为用户提供流畅的浏览体验。在实际开发中,还需要考虑到错误处理、兼容性测试以及代码的可维护性,确保整个系统稳定运行。

    asp.net 无刷新上传控件 模仿邮箱上传模式

    首先,我们需要创建一个ASP.NET Web表单,其中包含一个上传控件(例如FileUpload)。FileUpload控件允许用户选择本地计算机上的文件。然后,我们可以通过JavaScript或者jQuery监听文件选择事件,当用户选择文件后,...

    javascript 经典tab控件

    “完全模仿ext”表明这个JavaScript Tab控件的设计灵感来源于ExtJS,这是一个强大的JavaScript库,提供了丰富的UI组件和数据绑定功能。ExtJS中的TabPanel组件是其核心部分之一,能够创建具有多标签页的容器。模仿...

    模仿QQ分栏的一款控件

    在IT行业中,模仿QQ分栏的控件设计涉及到UI(用户界面)设计、前端开发以及可能的后端数据交互等多个方面。下面我们将详细探讨这些知识点。 1. UI设计: QQ分栏的设计旨在提供清晰、直观的用户体验。设计师需要...

    一个纯js开发的日历、日程控件

    这个压缩包文件提供了一个纯JavaScript开发的日历和日程控件,这意味着它不依赖任何特定的库或框架,如jQuery或其他重型库,而是完全基于JavaScript语言本身构建的。这使得它具有轻量级、快速加载的特点,并且可以在...

    html5微信支付 页面效果

    HTML5引入了离线存储(Offline Storage)、表单控件升级、媒体元素、Canvas绘图、Geolocation定位、WebSocket实时通信等新功能,这些特性极大地提升了网页的交互性和功能丰富性。在微信支付页面中,可能会用到Canvas...

    地区控件带搜索功能

    从压缩包子文件的文件名称“jquery城市选择器仿猎聘支持多选单选”来看,这个控件是基于jQuery库实现的,它模仿了猎聘网的城市选择器功能,支持用户进行多选和单选操作。这意味着控件不仅能够处理单一的地理位置选择...

    IE树控件IE树控件IE树控件

    当用户展开一个节点时,只请求必要的子节点数据,而不是一次性加载整个树,这降低了页面加载时间。 5. **服务器端编程**:在服务器端,开发者可能需要使用PHP、ASP.NET、Java等语言处理AJAX请求,返回JSON或XML格式...

    JS日历控件(可以选择多个日期)

    本篇文章将深入探讨如何创建一个支持选择多个日期的JS日历控件。 首先,我们需要理解JavaScript的基础,它是Web开发中的主要脚本语言,用于在浏览器端运行。通过使用JavaScript,我们可以动态更新页面内容,处理...

Global site tag (gtag.js) - Google Analytics