jQuery选择动态内容PHP

我正在用PHP创建一系列列表。然后我试图使用jQuery对.sortable()进行排序。如果我只有一个列表，我有它的工作。但是，如果我有多个列表，jQuery正在遍历这两个列表并只记住最后一个列表。我看到.each()是如何造成这种情况的，我只是不知道如何解决这个问题。jQuery选择动态内容PHP

HTML

<div class="list"> 
    <ul id="sortList_1"> 
    <li class="item_1" id="item_111">Item 1</li> 
    <li class="item_2" id="item_222">Item 2</li> 
    <li class="item_3" id="item_333">Item 3</li> 
    </ul> 
</div> 

    <div class="list"> 
     <ul id="sortList_2"> 
     <li class="item_1" id="item_444">Item 1</li> 
     <li class="item_2" id="item_555">Item 2</li> 
     <li class="item_3" id="item_666">Item 3</li> 
     </ul> 
    </div>

jQuery的

$(".list").each(
     function(e) { 
     num = e + 1; 
     $("#sortList_" + num).sortable(
      {stop:function(i) { 
       serial = $("#sortList_" + num).sortable("serialize"); 
       $.ajax({ 
        type: "GET", 
        url: "writeDB.php", 
        data: serial 
       }); 
      } 
     });  
    });

来源

2012-07-11 Bungdaddy

是不是有一个额外的逗号从最终三行？ – 2012-07-11 01:29:23

只是错过了代码粘贴。我已经删除不透明和光标mods - 编辑代码 – Bungdaddy 2012-07-11 01:30:41

对不起，但我没有看到一个问题：http://jsfiddle.net/SO_AMK/EMJax/ – 2012-07-11 01:36:04

当我运行你的代码，.sortable('serialize')回报null所有列表。根据documentation：

如果serialize返回空字符串，请确保id属性包含下划线。它们必须采用以下形式：“set_number”例如，具有id属性foo_1，foo_5，foo_2的3个元素列表将序列化为foo [] = 1 & foo [] = 5 & foo [] = 2。您可以使用下划线，等号或连字符来分隔组和数字。例如，foo = 1或foo-1或foo_1全部序列化为foo [] = 1。

所以，你可以修改每个项目的格式

<li class="item_1" id="item_444">Item 1</li>

的id属性，你的脚本应该正常工作。您可能会考虑将item_前缀更改为引用项目列表中项目从（即list1_...与list2_...）或者指定序列化数据用于在ajax调用的data中的列表。

data: { serial: serial, list_id: $(this).attr('id') }

编辑：可以清理你的代码有点太：http://jsfiddle.net/u425C/

来源

2012-07-11 01:40:14 deefour

你是正确的，但是，从each（）发生的循环我只从最后一个ul列表中获取id属性，在sortList_2的情况下。在上面的例子中，没有包含item_111，这是我的不好之处。这是我如何进行PHP渲染。我将修改示例 – Bungdaddy 2012-07-11 01:45:12

请参阅上面的我的jsfiddle;它会为这两个列表生成预期的ajax请求。 – deefour 2012-07-11 01:46:53

确实很聪明！写得好。 – Bungdaddy 2012-07-11 01:54:34

jQuery选择动态内容PHP

回答

相关问题