`

一个模仿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
分享到:
评论

相关推荐

    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库实现的,它模仿了猎聘网的城市选择器功能,支持用户进行多选和单选操作。这意味着控件不仅能够处理单一的地理位置选择...

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

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

    模仿微信朋友圈 图片浏览 h5 html5 js 不需要jquery 纯js(最新,以前那个不好用)

    本项目专注于使用纯JavaScript实现一个类似微信朋友圈的图片浏览功能,无需依赖jQuery库,提供了更轻量级的解决方案。微信的朋友圈图片浏览功能以其流畅的用户体验和丰富的交互性而闻名,包括图片预览、滑动切换以及...

Global site tag (gtag.js) - Google Analytics