浅谈js控制li标签排序问题 js调用php函数的方法

【Html代码】

<span style="font-size:14px;"><ul class="list-group">
   <? if ($categorys): ?>
  <? foreach ($categorys as $category):?>
    <li class="list-group-item" data-id="<? echo $category->id ?>">
      <? echo $category->name?>
        <a href="<? echo site_url('group/category/delete?id=' . $category->id) ?>" onclick="<?echo lang('confirm')?>">
            <span class="glyphicon glyphicon-remove"></span></a>
        </li>
    <? endforeach;?>
   <? else: ?>
  <div class="alert alert-danger">暂时没有设置</div>
   <? endif; ?>
</ul></span> 

【js代码】

<span style="font-size:14px;">   <script>
      require(["jquery","jqueryui"],function($) {
        var d = window.top.dialog({
          content: '配置已更新'
        });
        $(function() {
          $( ".list-group").sortable({
            stop: function( event, ui ) {
              data = '';
              $('li.list-group-item').each(function (){
                data += ',' + $(this).attr('data-id');
              });
              $.post('/group/category/listorder',{data:data});
              d.show();
              setTimeout(function () {
                d.close();
              }, 1000);
            }
          }).disableSelection();
        });
      });
    </script></span> 

【php代码】

<span style="font-size:14px;">public function listorder() {
    $data = explode(',', $this->input->post('data'));
    $i = 1;
    foreach ($data as $id) {
      if (!$id)
        continue;
      $this->category_model->save($id, array(
        'listorder' => $i,
      ));
      $i++;
    }
  } 

  public function delete() {
    $id = $this->input->get('id');
    $this->category_model->delete($id);
    messagebox(lang('success'), 'referer');
  }</span> 

以上就是小编为大家带来的浅谈js控制li标签排序问题 js调用php函数的方法全部内容了,希望大家多多支持我们~

(0)

相关推荐

  • JS中数组重排序方法

    1.数组中已存在两个可直接用来重排序的方法:reverse()和sort(). reverse()和sort()方法的返回值是经过排序后的数组.reverse()方法会反转数组项的顺序: var values=[1,2,3,4,5]; values.reverse(); alert(values); //5,4,3,2,1 在默认情况下,sort()方法按升序排列数组,sort()方法会调用每个数组项的toString()转型方法,然后比较得到字符串,确定如何排序.即使数组中的每一项都是数值,s

  • JavaScript排序算法动画演示效果的实现方法

    之前在知乎看到有人在问 自己写了一个冒泡排序算法如何用HTML,CSS,JavaScript展现出来排序过程.   感觉这个问题还挺有意思 .前些时间就来写了一个.这里记录一下实现过程. 基本的思想是把排序每一步的时候每个数据的值用DOM结构表达出来. 问题一:如何将JavaScript排序的一步步进程展现出来? 我试过的几种思路: 1.让JavaScript暂停下来,慢下来. JavaScript排序是很快的,要我们肉眼能看到它的实现过程,我首先想到的是让排序慢下来. 排序的每一个循环都让它停

  • JavaScript算法系列之快速排序(Quicksort)算法实例详解

    "快速排序"的思想很简单,整个排序过程只需要三步: (1)在数据集之中,选择一个元素作为"基准"(pivot). (2)所有小于"基准"的元素,都移到"基准"的左边:所有大于"基准"的元素,都移到"基准"的右边. (3)对"基准"左边和右边的两个子集,不断重复第一步和第二步,直到所有子集只剩下一个元素为止. 举例来说,现在有一个数据集{85, 24, 63, 45,

  • js基本算法:冒泡排序,二分查找的简单实例

    知识扩充: 时间复杂度:算法的时间复杂度是一个函数,描述了算法的运行时间.时间复杂度越低,效率越高. 自我理解:一个算法,运行了几次时间复杂度就为多少,如运行了n次,则时间复杂度为O(n). 1.冒泡排序 解析:1.比较相邻的两个元素,如果前一个比后一个大,则交换位置. 2.第一轮的时候最后一个元素应该是最大的一个. 3.按照步骤一的方法进行相邻两个元素的比较,这个时候由于最后一个元素已经是最大的了,所以最后一个元素不用比较. function sort(elements){ for(var i

  • javascript数组对象常用api函数小结(连接,插入,删除,反转,排序等)

    本文实例讲述了javascript数组对象常用api函数.分享给大家供大家参考,具体如下: 1. concat() 连接两个或多个数组,并返回结果 var a = [1,2,3]; var b = a.concat(6,7); console.log(a); //[1,2,3] console.log(b); //[1,2,3,6,7] 2. join(str) 把数组的所有元素用str分隔,默认逗号分隔 var a = [1,2,3] var b = a.join('|'); console.

  • AngularJS 过滤与排序详解及实例代码

    前面了解了AngularJS的使用方法,这里就简单的写个小程序,实现查询过滤以及排序的功能. 本程序中可以了解到: 1 angularjs的过滤器 2 ng-repeat的使用方法 3 控制器的使用 4 数据的绑定 程序设计分析 首先,如果要是先查询过滤,就要使用到AngularJS中的 过滤器filter 了. 直接在表达式的后面使用管道命令符 | ,按照下面的写法就可以达到一个过滤的效果: {{ persons | filter:query }} 通过使用filter实现过滤操作,query

  • JavaScript实现链表插入排序和链表归并排序

    本篇文章详细的介绍了JavaScript实现链表插入排序和链表归并排序,链表的归并排序就是对每个部分都进行归并排序,然后合并在一起. 1.链表 1.1链表的存储表示 //链表的存储表示 typedef int ElemType; typedef struct LNode { ElemType data; struct LNode *next; }LNode, *LinkList; 1.2基本操作 创建链表: /* * 创建链表. * 形参num为链表的长度,函数返回链表的头指针. */ Link

  • JavaScript 冒泡排序和选择排序的实现代码

    废话不多说了,直接给大家贴代码了,具体代码如下所述: var array = [1,2,3,4,5]; // ---> 服务 //效率 ---> 针对一个有序的数组 效率最高 //标志 true false for(var j = 0; j < array.length - 1;j++ ){ //- j 每次排序完成之后 后面减少比较的次数 var isTrue = true; //如果数组本身就是升序,则直接输出 for(var i = 0; i < array.length -

  • 基于javascript实现的快速排序

    function quickSort(arr){ //如果数组只有一个数,就直接返回: if(arr.length<1){ return arr; } //找到中间的那个数的索引值:如果是浮点数,就向下取整 var centerIndex = Math.floor(arr.length/2); //根据这个中间的数的索引值,找到这个数的值: var centerNum = arr.splice(centerIndex,1); //存放左边的数 var arrLeft = []; //存放右边的数

  • js利用appendChild对<li>标签进行排序的实现方法

    按照从大到小排序 appendChild: 假设父级a中已经有子节点b,那么a.appendChild(b)的作用是:1.先将子节点b从父级a中删除:2.再将子节点b添加到a中,放在最末尾. <body> <button id="bt1">提交</button> <ul id="ul1"> <li>32</li> <li>243</li> <li>43<

随机推荐