JQuery插件第三十三个：高级搜索下的排序功能

最新推荐文章于 2021-08-05 17:31:46 发布
最新推荐文章于 2021-08-05 17:31:46 发布
阅读量767 收藏
点赞数
分类专栏： 搜索 文章标签： jquery插件 class input function button xhtml
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/chinet_bridge/article/details/7415265
版权 
<!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.org/1999/xhtml">
<head>
    <title>无标题页</title>
    <script type="text/javascript" src="../jquery-1.6.js"></script>
</head>
<body><input id="ddd" type="hidden" value="10258" />
    <table border="0" cellpadding="0" cellspacing="0">
        <tr class="ser">
            <td width="9%" style="text-align: right;" class="search">
                <span style="text-align: right;">：</span>
            </td>
            <td width="12%">
                <input name="SN" id="SN" type="text" class="sousuo" />
            </td>
            <td width="10%" style="text-align: right;">
                <input name="Startdate" id="Startdate" type="text" class="sousuo2" />
                —
            </td>
            <td width="9%">
                <input name="Enddate" id="Enddate" type="text" class="sousuo2" />
            </td>
            <td width="7%" style="text-align: right;" class="hidfeild">
                加工厂：
            </td>
            <td width="14%" class='hidfeild'>
            </td>
            <td width="5%" style="text-align: right;">
                 <span id="checkerspan">审核人：</span>
            </td>
            <td width="11%" id="checkerddl">
            </td>
            <td width="10%">
                 
            </td>
            <td width="8%">
                 
            </td>
            <td width="8%">
                 
            </td>
            <td width="14%" class='hidcol'>
                 
            </td>
            <td class='hidcol'>
                 
            </td>
        </tr>
        <tr class="ser">
            <td style="text-align: right; padding: 10px 0;">
            </td>
            <td>
            </td>
            <td style="text-align: right;">
                <input name="checkStartdate" id="checkStartdate" type="text" value="审核开始日期" class="sousuo2" />
                —
            </td>
            <td>
                <input name="checkEnddate" id="checkEnddate" type="text" value="审核结束日期" class="sousuo2" />
            </td>
            <td style="text-align: right;" class="hidfeild">
                 <span id="perspan">收货人：</span>
            </td>
            <td class='hidfeild' id="perddl">
                <select name="per" id="per" class="dropdownlist">
                    <option>ff </option>
                    <option>ee</option>
                </select>
            </td>
            <td align="right">
                 
            </td>
            <td>
            <a id="btn1"  >搜索</a>
            </td>
            <td align="right">
            </td>
            <td>
                 
            </td>
            <td>
                 
            </td>
            <td class='hidcol'>
                 
            </td>
            <td class='hidcol'>
                <input id="Button1" type="button" value="button" />
                <script src="jquery.cookie.js" type="text/javascript"></script>
                <script src="jquery.setTip.js" type="text/javascript"></script>
                <script src="jQuery.urlParam.js" type="text/javascript"></script>
                <script src="jQuery.keyValue.js" type="text/javascript"></script>
                <script src="jQuery.AdvSearch.js" type="text/javascript"></script>
                <script src="jQuery.orderBySearch.js" type="text/javascript"></script>
                <script language="javascript" type="text/javascript">
                    $(".ser").AdvSearch({
                        searchbtn: "#btn1",
                        otherUrl: "&ddd=1&ss=1"
                    });    
                    $("#Button1").data({"ddd":123456});
                    $("#Button1").orderBySearch();   
                </script>
            </td>
        </tr>
    </table>
</body>
</html>

(function ($) { 
  $.fn.orderBySearch = function(options){
      var defaults = {
        searchArea:".ser",
        searchbtn: "#btn1",
        otherUrl: "&ddd=1&ss=1",
        param:"ddd"
      }
      var opts = $.extend(defaults, options);
		//主要执行过程		        
	  this.each(function(){
            var $obj=$(this);
            $obj.click(function(){
                var btn=$(opts.searchbtn);
                btn.unbind();
                with($.keyValue){
                    str=opts.otherUrl;
                    firstChar="&";
                    secondChar="=";
                }
                opts.otherUrl=$.keyValue.set(opts.param,$obj.data(opts.param));
                $(opts.searchArea).AdvSearch({
                    searchbtn: opts.searchbtn,
                    otherUrl: opts.otherUrl
                });
                btn.trigger("click");
            });
	  });			
  };
})(jQuery);

chinet_bridge
关注
专栏目录
第08课：使用 JqGrid 插件实现分页功能
程序员有故事
09-22 707
什么是分页 其实分页是一个网站系统中非常重要的功能，在各类电商网站、新闻网站、音乐网站、各类后台管理系统等等网站中都会存在，分页功能也是十分常见的功能，我们来看一下比较常见及常用的分页功能的展现形式。 百度分页 在百度首页搜索框中输入“Java”查询相关信息之后跳转到搜索结果页面，页面中大致会有10条左右的数据列表，此时展示的是第1页的数据，如果想看后面的搜索内容点击页面下方的分页信息即可，比如点...
前端有关js和jQuery面试题！！！
最新发布
2301_76766756的博客
08-19 439
捕获阶段(从window对象传导到目标节点(从外到里)，这个阶段不会响应任何事件)，目标阶段， (在目标节点上触发)，冒泡阶段(从目标节点传导回window对象(从里到外))，事件委托/事件代 理就是利用事件冒泡的机制把里层需要响应的事件绑定到外层。所谓的同源，指的是协议，域名，端口相同。函数防抖是需要一个延时器来辅助实现，延迟执行需要执行的代码，如果方法多次触发，把上次记 录的延迟执行代码用cleartimeout清除掉，重新开始，如果计时完毕，没有方法来访问触发，则执 行代码。
jquery 多条件搜索特效 高级查询
11-23
jquery 多条件搜索特效 高级查询 含单选，多选组合查询
ajax jquery 高级搜索,jQuery高级Ajax
weixin_35968523的博客
08-05 207
.load();加载远程的HTML文件代码，并插入到指定的DOM节点中。可以只传入一个参数，表示加载一个静态的HTML代码片段。$("#div1").load("load.html");$.ajax():是JQuery最底层的ajax函数，参数接收一个大对象。对象里面的属性和方法，表示ajax请求的相关设置：① url : 请求远程文件的路径② type： Ajax请求的类型，可选值 get/po...
高级搜索Jquery插件2015年02月28日版本
02-28
当页面是嵌套母板页时，textbox的客户端ID是被系统加过前缀的，此时可以通过$.fn.AdvSearch.encode 替换成简洁的地址参数名称
jQuery实现高级检索功能
12-29
初学JQuery，写了一个高级检索的动态输入框，如图所示：  实现的功能： * 当选择属性下拉框中不同类型（字符串、数字、日期）的属性时，后面弹出不同数量的和不同格式的文本框（字符串弹出一个输入文本框，数字型的弹出两个输入文本框，日期型的弹出两个日期选择控件）； * 单击“添加条件”链接后，下面会增加一行条件输入，可以选择逻辑（与、或、非）、属性。 html部分代码如下： < div xss=removed class =row> < dd> <select id = condition class= span2 style = 'width:110px;' >
jquery实现页内搜索、css实现页内排序
sinat_38546399的博客
09-30 327
jquery实现页内搜索、css实现页内排序
JavaScript_JQuery_CSS_CSS_DIV漂亮的实例123个
10-11
73. 一款jQuery插件slide幻灯片切换图片宽高自适应 74. 一款jQuery漂亮淡出淡入焦点大图切换源码 75. 一款jquery缩略图商品切换放大展示功能插件 76. 一款使用jQuery左右控制横向图片滚动的代码 77. 一款...
JQuery&CSS;&CSS;+DIV实例大全.rar
08-13
一款jQuery插件slide幻灯片切换图片宽高自适应 74.一款jQuery漂亮淡出淡入焦点大图切换源码 75.一款jquery缩略图商品切换放大展示功能插件 76.一款使用jQuery左右控制横向图片滚动的代码 77.一款基于jquery...
jQuery产品筛选导航菜单，高级搜索
03-23
jQuery产品筛选导航菜单，高级搜索 很实用 大家可以试试
可分页、排序和搜索的jQuery表格插件
12-10
jquery.fancyTable是一款可分页、排序和搜索的jQuery表格插件。该插件可以将静态的HTML表格转换为可以进行分页，按字段进行排序，和对表格进行全局搜索的动态表格。
jQuery插件select2利用ajax高效查询大数据列表（可搜索、可分页）
12-10
select2是一款jQuery插件，是普通form表单select组件的升级版。 可以定制搜索、远程数据集（Remote data，本篇主要介绍点）、无限滚动（数据分页功能，这一点很妙）、还有很多高端的参数设置（有需要的下次介绍）。 内置了40种国际化语言，不过这里我们只需要用到中文。 同时支持现代和传统浏览器内置，甚至包括惹人不高兴的IE8。 那么，现在让我们开始一段select2的奇幻之旅吧！ 一、惊艳的效果，来一睹为快吧 本地实战结果 二、导入css和js到网站上 1.使用CDN，节省自己网站的流量 <link href="https://cdnjs.cloudflare
jQuery CSS3下拉高级搜索框特效.zip
07-05
jQuery CSS3下拉高级搜索框特效是一款当用户点击了搜索按钮之后，会出现搜索输入框，以及一个带相关搜索链接的面板供用户选择。
jQuery和CSS3炫酷高级搜索框设计效果
04-25
jQuery和CSS3炫酷高级搜索框设计效果
35 个高级但使用简单的 jQuery 插件
weixin_33762130的博客
02-02 97
Subway Map Visualization jQuery Plugin Download | Demo jquery-toastmessage-plugin Download | Demo Gmap Google Maps Plugin for jQuery Download | Demo Recurly.js Download | Demo 960 Grid...
JQuery实现高级检索功能
没有人是一座孤岛
03-20 2238
初学JQuery，写了一个高级检索的动态输入框，如图所示： 实现的功能：* 当选择属性下拉框中不同类型（字符串、数字、日期）的属性时，后面弹出不同数量的和不同格式的文本框（字符串弹出一个输入文本框，数字型的弹出两个输入文本框，日期型的弹出两个日期选择控件）； * 单击“添加条件”链接后，下面会增加一行条件输入，可以选择逻辑（与、或、非）、属性。 html部分代码如下：< div id= "0"
jquery 表格排序，实时搜索表格内容
freejs
05-18 114
jquery 表格排序，实时搜索表格内容   演示     XML/HTML Code &lt;table class="table-sort"&gt;   &lt;thead&gt;   &lt;tr&gt;   &lt;th class="table-sort"&gt;First Name&lt;/th&gt;   &lt;th class=&q
Jquery高级
troysps的博客
05-13 888
Jquery 高级 什么是事件: 事件是可以被 JavaScript 侦测到的行为 比如: JavaScript 创建动态页面。网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。 比如说，当用户单击按钮或者提交表单数据时，就发生一个鼠标单击（onclick）事件，需要浏览器做出处理，返回给用户一个结果。 jquery事件 focus事件 获取焦点事件 一般不...
Jquery插件tableSort：高效快速表格排序与复杂条件支持
JQuery表格排序插件是一个实用且灵活的工具，能够简化前端开发者在处理表格数据排序的工作，并提供多种排序策略，适应不同的业务场景和性能要求。通过合理的配置，用户可以轻松实现自定义的、高性能的表格数据管理。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值