jquer搜索

<body>
<br/>
<center>
<tr><td>创建时间：</td><td><input type="text" name="ctime" id="calen"/></td></tr>
<tr><td>创建时间：</td><td><input type="text" name="etime" id="calen2"/></td></tr><br/>
<tr><td>筛选条件：</td>
					<td>状态：<input type="text" name="status" id="status"/></td>
					<td>支付方式：<input type="text" name="pay"/></td>
					<td>订单号<input type="text" name="order_id"/></td>
					<td><input type="submit" value="查询" /></td>
					</tr><br/>
<table border="20" id="dd">

<tr>
	<td>id</td>
	<td>货号</td>
	<td>创建时间</td>
	<td>结束时间</td>
	<td>支付状态</td>
	<td>实付金额</td>
	<td>付款方式</td>
	<td>用户名</td>
</tr>
<?php
//header("content-type:text/html;charset=utf-8");

//1.初始化，创建一个新cURL资源
$ch = curl_init();

//2.设置URL和相应的选项
curl_setopt($ch, CURLOPT_URL, "http://www.getinfo.com");

//执行之后不打印出来
curl_setopt($ch,CURLOPT_RETURNTRANSFER,true);
curl_setopt($ch, CURLOPT_HEADER, 0);

//3.抓取URL并把它传递给浏览器
$content = curl_exec($ch);

//4.关闭cURL资源，并且释放系统资源
curl_close($ch);

$rr=json_decode($content,true);
$arr=$rr['data'];
//echo  var_dump($arr);

foreach ($arr as $key => $v) {
		echo"<tr>";
		echo "<td>".$v['id']."</td>";
		echo "<td>".$v['order_id']."</td>";
		echo "<td>".$v['ctime']."</td>";
		echo "<td>".$v['etime']."</td>";
		echo "<td>".$v['status']."</td>";
		echo "<td>".$v['real_amount']."</td>";
		echo "<td>".$v['pay']."</td>";
		echo "<td>".$v['username']."</td>";
		echo"</tr>";
　　　　}
?>
</table>
</center>
</body>
<script>
	$(function()
		{
		$("#status").blur(function() {
			var status=$("#status").val();
			$.post("showapp1.php", { name: status},function(data){
   				$("#dd").html(spilt(data));
   				},'json');
			})
		function spilt(data) {
            var str="<tr><td>id</td><td>货号</td><td>创建时间</td><td>结束时间</td>
　　　　　　　　　　　　<td>支付状态</td><td>实付金额</td><td>付款方式</td><td>用户名</td></tr>";
         	for (var i=0;i<data.coun;i++){
                str+='<tr><td>'+data[i]['id']+'</td>';
                str+='<td>'+data[i]['order_id']+'</td>';
                str+='<td>'+data[i]['ctime']+'</td>';
                str+='<td>'+data[i]['etime']+'</td>';
                str+='<td>'+data[i]['status']+'</td>';
                str+='<td>'+data[i]['real_amount']+'</td>';
                str+='<td>'+data[i]['pay']+'</td>';
                str+='<td>'+data[i]['username']+'</td><tr>';
                }
            return str;

        }
})
	
</script>

showapp.php
<?php
header("Content-type:text/html;charset=utf-8");
        $link = mysql_connect("localhost", "root",'123456');
        mysql_select_db("hh", $link);
        mysql_query("set names utf8");
        $arr=$_POST['name'];
	$sql="select * from yuekao where status='".$arr."'";
	$connect=Db::getInstance()->connect();
	$result=mysql_query($sql,$connect);
	$res=array();
	while($res=mysql_fetch_assoc($result)){
		$re[]=$res;
		};
	$re['coun']=count($re);
	echo json_encode($re);

jquery遍历数组与筛选数组的方法

grep
grep()方法用于数组元素过滤筛选
grep(array,callback,invert)
array：待过滤数组;
callback：处理数组中的每个元素，并过滤元素，该函数中包含两个参数，第一个是当前数组元素的值，一个是当前数组元素的下标，即元素索引值。此函数应返回一个布尔值。另外，此函数可设置为一个字符串，当设置为字符串时，将视为“lambda-form”（缩写形式？），其中 a 代表数组元素，i 代表元素索引值。如“a > 0”代表“function(a){ return a > 0; }”
invert：布尔型可选项，默认值false，值为true或false，如果 “invert” 为 false 或为设置，则函数返回数组中由过滤函数返回 true 的元素，当”invert” 为 true，则返回过滤函数中返回 false 的元素集

<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
    function(){
        var array = [1,2,3,4,5,6,7,8,9];
        var filterarray = $.grep(array,function(value){
            return value > 5;//筛选出大于5的
        });
        for(var i=0;i<filterarray.length;i++){
            alert(filterarray[i]);
        }
        for (key in filterarray){
            alert(filterarray[key]);
        }
    }
);
</script>

each
each的使用方法
在jQuery里有一个each方法，用起来非常的爽，不用再像原来那样写for循环，jQuery源码里自己也有很多用到each方法。
其实jQuery里的each方法是通过js里的call方法来实现的。

<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
    function(){
        var anObject = {one:1,two:2,three:3};//对json数组each
        $.each(anObject,function(name,value) {
            alert(name);
            alert(value);
        });
        var anArray = ['one','two','three'];
        $.each(anArray,function(n,value){
            alert(n);
            alert(value);
        }
        );
    }
);
</script>

inArray
jQuery.isArray(obj) 是 jQuery 1.3 新增。测试对象是否为数组。返回值:Boolean
参数 : objObject用于测试是否为数组的对象
示例 :检测是否为数组

<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
    function(){
        var anArray = ['one','two','three'];
        var index = $.inArray('two',anArray);
        alert(index);//返回该值在数组中的键值，返回1
        alert(anArray[index]);//value is two
    }
);
</script>

map
map() 把每个元素通过函数传递到当前匹配集合中，生成包含返回值的新的 jQuery 对象。
由于返回值是 jQuery 封装的数组，使用 get() 来处理返回的对象以得到基础的数组。
.map() 方法对于获得或设置元素集的值特别有用。请思考下面这个带有一系列复选框的表单

<script type='text/javascript' src="/jquery.js"></script>
<script type="text/javascript">
$().ready(
    function(){
        var strings = ['0','1','2','3','4','S','6'];
        var values = $.map(strings,function(value){
                var result = new Number(value);
                return isNaN(result) ? null:result;//isNaN:is Not a Number的缩写
            }
        );
        for (key in values) {
            alert(values[key]);
        }
    }
);
</script>

遍历json对象：

var obj ={”name”:”冯娟”,”password”:”123456″,”department”:”技术部”,”sex”:” 女”,”old”:30};
遍历方法：
for(var p in obj){
    str = str+obj[p]+',';
    return str;
}

即点即改：

<div class="headbar">
    <div class="position"><span>商品</span><span>></span><span>商品分类管理</span><span>></span><span>分类列表</span></div>
    <div class="operating">
        <a href="javascript:;"><button class="operating_btn" type="button" 
onclick="window.location='{url:/goods/category_edit}'"><span class="addition">添加分类</span></button></a>
    </div>
</div>

<form action="{url:/goods/category_sort}" method="post" name="category_list">
<div class="content">
    <table id="list_table" class="list_table">
        <colgroup>
            <col width="100px" />
            <col width="300px" />
            <col width="100px" />
            <col width="220px" />
        </colgroup>

        <thead>
            <tr>
                <th>排序</th>
                <th>分类名称</th>
                <th>首页显示</th>
                <th>操作</th>
            </tr>
        </thead>

        <tbody>
            {foreach:items=$category item=$item}
            <tr id="{$item['id']}" parent={$item['parent_id']}>
                <td><input class="tiny"  id="s{$item['id']}" size="2" type="text" onblur="toSort({$item['id']});" 
　　　　　　　　　　value="{$item['sort']}" /></td>

                <td><img style='margin-left:{echo:$item['floor']*20}px' class="operator" src="{skin:images/admin/close.gif}" 
　　　　　　　　　　　　onclick="displayData(this);" alt="关闭" >
                    <span class="cat_name">{$item['name']}</span></td>


                <td>{if:$item['visibility']=='1'}<span class="green">是</span>{else:}<span class="brown">否</span>{/if}</td>


                <td>
                    <a href="{url:/goods/category_edit/cid/$item[id]}">
　　　　　　　　　　　　<img class="operator" src="{skin:images/admin/icon_edit.gif}" alt="修改" title="修改" /></a>
                    <a href="javascript:void(0)" onclick="delModel({link:'{url:/goods/category_del/cid/$item[id]}'})">
　　　　　　　　　　　　<img class="operator" src="{skin:images/admin/icon_del.gif}" alt="删除" title="删除" /></a>
                </td>
            </tr>
            {/foreach}
        </tbody>
    </table>
</div>
</form>

<script language="javascript">
//折叠展示
function displayData(_self)
{
    if(_self.alt == "关闭")
    {
        jqshow($(_self).parent().parent().attr('id'), 'hide');
        $(_self).attr("src", "{skin:images/admin/open.gif}");
        _self.alt = '打开';
    }
    else
    {
        jqshow($(_self).parent().parent().attr('id'), 'show');
        $(_self).attr("src", "{skin:images/admin/close.gif}");
        _self.alt = '关闭';
    }
}

function jqshow(id,isshow) {
    var obj = $("#list_table tr[parent='"+id+"']");
    if (obj.length>0)
    {
        obj.each(function(i) {
            jqshow($(this).attr('id'), isshow);
        });
        if (isshow=='hide')
        {
            obj.hide();
        }
        else
        {
            obj.show();
        }
    }
}
//排序
function toSort(id)
{
    if(id!='')
    {
        var va = $('#s'+id).val();
        var part = /^\d+$/i;
        if(va!='' && va!=undefined && part.test(va))
        {
            $.get("{url:/goods/category_sort}",{'id':id,'sort':va}, function(data)
            {
                if(data=='1')
                {
                    alert('修改商品分类排序成功!');
                }else
                {
                    alert('修改商品分类排序错误!');
                }
            });
        }
    }
}


</script>

<script>

  $(document).on('click','.cat_name',function(){
      old_val=$(this).html();
      var str="<input class='ji' type='text' value="+old_val+">";
      $(this).html(str);
      $(this).removeClass();
      $(document).on('blur','.ji',function(){
          var obj=$(this);
          //alert(obj);
          var new_val=$(this).val();
          var  id=$(this).parent().parent().parent().attr('id');
          //获取要修改内容的id
          $.ajax({
              type:'post',
              url:'{url:/goods/ji}',
              data:{
                  id:id,
                  name:new_val
              },
              success:function(msg){
                 tt="<span class='cat_name'>"+msg+"</span>";
                  obj.parent().html(tt);
              }
          });
          if(new_val=="")
          {
              alert('修改内容不能为空');exit();
          }
      })
  })

</script>

function ji(){
        $query=new IModel('category');
        $id=$_POST['id'];
        $name=$_POST['name'];
        //$price=$_POST['val'];
        $query->setData(array(
            'name'=>$name
        ));

        $re=$query->update('id='.$id);
        if($re){
            echo $name;
        }
    }

posted @ 2017-05-31 15:26 穷帅哥依然纵横一方阅读(176) 评论(0) 编辑收藏举报

刷新页面返回顶部

穷帅哥依然纵横一方

穷帅哥依然纵横一方

jquer搜索

公告