html(隐藏域)<input type=“hidden“ id=““/>用法

解决一个前端页面查询的方法:

问题介绍:

html(隐藏域)<input type=“hidden“ id=““/>用法_第1张图片

(1)中描述不添加查询条件,那就查询所有,之后点击查询。

(2)查询结果数据库中一共有10条记录,每页分两条共五页。

html(隐藏域)<input type=“hidden“ id=““/>用法_第2张图片

(1)这个在名称出输入 2。

(2)但是不点击查询。

(3)点击下一页或者第2...3页等等。

(4)看查询结果发生改变,它自己会查询名称带“2”的信息。

总结:其实我们没有点击查询,只是在查询栏的名称处输入了“2”,但是当我们想查看下一页的时候它会自动查询名称带“2”的信息。

那么怎么解决这类问题呢?

  很简单:就是加入一下隐藏域。

      
      
      
      
$("#searchBtn").click(function () {

			/*

			点击查询按钮的时候,我们应该将搜索框中的信息保存起来,保存到隐藏域中

			 */

			$("#hidden-name").val($.trim($("#search-name").val()));
			$("#hidden-owner").val($.trim($("#search-owner").val()));
			$("#hidden-startDate").val($.trim($("#search-startDate").val()));
			$("#hidden-endDate").val($.trim($("#search-endDate").val()));

			pageList(1,2);


		})
		

function pageList(pageNo,pageSize) {

		//查询前,将隐藏域中保存的信息取出来,重新赋予到搜索框中
		$("#search-name").val($.trim($("#hidden-name").val()));
		$("#search-owner").val($.trim($("#hidden-owner").val()));
		$("#search-startDate").val($.trim($("#hidden-startDate").val()));
		$("#search-endDate").val($.trim($("#hidden-endDate").val()));

更改完之后的效果就是我们只要不点击查询,那么他就不会自己查。

你可能感兴趣的:(web前端基础知识)