jquery构建功能型表单(一)

比较常见的表单验证功能

当在网站中使用jQuery时,我们必须时常提醒自己如果用户禁用了 JavaScript,那么页面看起来会怎样、功能是否还健全(当然,除非我们知道用户是谁,而且知道他们会怎样 配置浏览器)。但是,这并不意味着我们不能为JavaScript的用户创建更美观或者功能更强大的网站。渐进增 强 的原则在JavaScript开发者中间如此流行,就是因为它在为多数人提供额外功能的同时,还能照顾到全体 用户的需求。

效果图如下:

 

如果我上面这个示例用户禁用了js,效果图如下:

此时内容结构还是一样的清晰明了。

时间: 2024-09-17 04:51:17

jquery构建功能型表单(一)的相关文章

jquery构建功能型表单(二)

在构建功能型表单(一) 中介绍了一些适用于用户进行文本性输入的表单功能. 然而,有时候表单 中的内容也会以数字为主. 当处理作为表单内容的数字值时,也可以实现另外几种表单增强功能. 数字表单的典型代表就是购物车.在购物车表单中,应该允许用户更新购买的商品数量,同时,也要 为用户提供价格和总金额的数字反馈. 构建功能行表单(二) 1.在操作表单前 先为表格应用标准的行条纹效果,美化一下表格的外观 Js代码 var stripe = function(){ $("#cart tbody tr:vis

jquery 构造函数在表单提交过程中修改数据

  这篇文章主要介绍了jquery 构造函数在表单提交过程中修改数据的方法,十分简单实用,有需要的小伙伴可以参考下. 先贴代码 ? 1 2 3 4 5 6 7 <script type="text/javascript"> function appendText(){ var content = $("#textarea").val(); var new_content = content + "wap"; $("#text

Jquery插件easyUi表单验证提交

 本篇文章主要是对Jquery插件easyUi表单验证提交的示例代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助  代码如下: <form id="myForm" method="post">   <table align="center" style="width:400px;height:auto;margin-top: 20px">            <tr>    

jquery提交form表单时禁止重复提交的方法

 这篇文章主要介绍了jquery提交form表单时禁止重复提交的方法,需要的朋友可以参考下    代码如下: $(document).ready(function() {   $('form').submit(function() {     if(typeof jQuery.data(this, "disabledOnSubmit") == 'undefined') {       jQuery.data(this, "disabledOnSubmit", { s

jquery序列化form表单使用ajax提交后处理返回的json数据

 这篇文章主要介绍了jquery序列化form表单,使用ajax提交后处理返回的json数据的示例,需要的朋友可以参考下 1.返回json字符串:    代码如下: /** 将一个字符串输出到浏览器 */     protected void writeJson(String json) {         PrintWriter pw = null;         try {             servletResponse.setContentType("text/plain;cha

jquery提交form表单简单示例分享

 这篇文章主要介绍了jquery提交form表单示例,需要的朋友可以参考下   代码如下: $.ajax({ url : 'deliveryWarrant/update.do', data : $('#myform').serialize(), type : "POST", success : function(data) { var res = eval('(' + data + ')'); if (res && res.success == true) {  ale

jQuery实现form表单元素序列化为json对象的方法_jquery

本文实例讲述了jQuery实现form表单元素序列化为json对象的方法.分享给大家供大家参考,具体如下: 这段代码序列化form表单元素为json对象: <!Doctype html> <html xmlns=http://www.w3.org/1999/xhtml> <head> <title>jQuery扩展--form序列化到json对象</title> <meta http-equiv=Content-Type content=&

jQuery实现form表单基于ajax无刷新提交方法详解_jquery

本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.o

jquery 构造函数在表单提交过程中修改数据_jquery

先贴代码 <script type="text/javascript"> function appendText(){ var content = $("#textarea").val(); var new_content = content + "wap"; $("#textarea").attr("value",new_content); }; </script>  然后再在 f