首页 > 其他分享 >一个模仿HTML5功能的jquery控件

一个模仿HTML5功能的jquery控件

时间:2022-12-08 12:34:55浏览次数:76  
标签:jquery 控件 myform HTML5 html5form method


原文: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,控件,myform,HTML5,html5form,method
From: https://blog.51cto.com/u_14230175/5920924

相关文章

  • day39-jquery
    初始jquery导入jquery:外部链接导入:<scriptsrc="http://libs.baidu.com/jqueryui/1.8.22/jquery-ui.min.js"></script> 下载jquery包 <scriptsrc="lib/jquer......
  • 三、继续进行——Asp.net ajax的主要控件
     一、前言打开工具箱的Ajaxextensions可以看到五个ajax控件,在vs2008中它们已经集成到了.netframerwork3.5中,如果是之前版本的vs则需要自己去下载文件来安装。这五个控件......
  • JQuery基础与JQuery UI
    JQuery基础 一、         JQuery简介 二、         第一个JQuery程序三、         JQuery选择器 四、         JQuery包装集 ......
  • jQuery再学习之三、jQuery操作
    前言jQuery也有自己的方式操作属性、css、值等。  1         使用jQuery操作元素属性1.1       attr(…):读取元素属性,例:$("...").attr("type")读取元......
  • JQuery UI之(四)手风琴面板——accordion
    一、前言手风琴面板我又叫他可折叠面板,可以使用户创建一组可折叠的面板二、开始动手添加样式和js库:<linktype="text/css"rel="Stylesheet"href......
  • jQuery再学习之二、jQuery选择器
    前言jQuery选择器非常非常强大而且灵活,要完全掌握它是需要狠下一番功夫的。当然,掌握了主要的部分后,其它的了解就好,因为一些比较偏的毕竟用得少,而且可以有其它方法来实现。 ......
  • jQuery再学习之一、jQuery核心
    前言     jQuery核心是最基础的jQuery对象,或者叫函数,有了它我们才可以进行其它的操作,所以,需要认真掌握。  jQuery核心函数1         获取jQuery对象(包装......
  • JQuery UI之(五)日期选择——Datepicker
    一、         前言JQuery官方的Datepicker控件,可以很方便的使用,但是在我看来他所提供的功能却稍显简单,并不能完全地符合我们的需求,所以,如果只是很简单的需求的话......
  • dojo,jquery,mootools三种框架实现的ajax效果
    经常在微BLOG上,或者象tudou,ku6等视频网站上,看到"查看评论"的按钮,点后就显示列表,是AJAX效果的,找到老外的一篇文,讲这个实现:​​​http://davidw......
  • 【NX二次开发】线性尺寸控件-nan(ind)
     #include<cmath>doubledouLinear_dim0=this->linear_dim0->GetProperties()->GetDouble("Value");if(isnan(douLinear_dim0)){//错误,值应为数字!} ......