如何在现有的foreach循环中添加div包装器

Question

我有一个PHP foreach循环正在进行，它正在循环一些来自数据库的数据

在foreach循环中，我有一对div元素，其中包含来自数据库的每个动态数据。每个数据都有item1、item2、item3等id。循环中总共有8个条目。我试图为item5、item6、item7和item8创建一个拖放操作。基本上只有4个底部我想添加这个拖放功能。我的HTML结构现在看起来是这样的:

<div id="sortable_area_only" class="column>
<div id="item1"></div>
<div id="item2"></div>
<div id="item3"></div>
<div id="item4"></div>
<div id="item5"></div>
<div id="item6"></div>
<div id="item7"></div>
<div id="item8"></div>
</div>

我想创建这样的东西:

<div id="item1"></div>
<div id="item2"></div>
<div id="item3"></div>
<div id="item4"></div>
<div id="sortable_area_only" class="column>
<div id="item5"></div>
<div id="item6"></div>
<div id="item7"></div>
<div id="item8"></div>
</div>

只有在"sortable_area_only"可以排序/拖放。在"sortable_area_only"之外不能删除任何内容。div容器。我一直在尝试通过使用JavaScript和/或jQuery/jQuery UI来实现这一点。

这与我的PHP文件中的内容类似:

<?php
$item = 1;
echo('<div id="sortable_area_only" class="column">');
foreach($value as $someValue){
echo('<div id="item'.$item++.'">'.$someValue.'</div>');
}
echo('</div>');
?>

可以看到，上面的foreach循环将产生类似于我在第一个HTML结构中提到的内容。

下面是我的jQuery代码拖放元素。

/** Add sortable/draggable function **/
$('.column').sortable({
connectWith: '.column',
cursor: 'move',
placeholder: 'placeholder',
forcePlaceholderSize: true,
opacity: 0.4,
stop: function(event, ui)
{
// some code goes here
}
}).disableSelection();

我一直在网上搜索类似于我正在寻找的东西，但我找不到任何东西。任何帮助将非常感激!谢谢你！

Answer 1

您可以在循环中访问item count。所以你可以试试这样。

<?php
$value = [1,2,3,4,5,6,7,8]; // <= just for example ( for easy testing by copy-paste )
$item =1;
foreach($value as $someValue){
echo $item===5 ? '<div id="sortable_area_only" class="column>' : '';
echo('<div id="item'.$item++.'">'.$someValue.'</div>');
echo $item===9 ? '</div>' : '';
}
?>

为什么$item===9 ?由于您的代码结构，最新的更改打印8，但添加1。所以你的$item值是9在结束的"div"