可排序列表包含给定数字 jquery
Sortable list contains between given numbers jquery
我正在尝试在数据 ID 中的给定数字之间使用可排序列表
我使用了一个代码来更新药物的数据 ID。但我的代码从 1 更新到 6
我想要它作为 11 到 16
或 21 至 26 ....
所以我只希望顶部或起始数据 ID 始终是起始数据 ID
但现在它总是变成 1
jQuery('.photos').sortable({
stop: function(event, ui){
$(".ui-sortable li").each(function(i, el){
$(el).attr('data-id',$(el).index()+1);
});
}
});
#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
#sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; cursor:move; }
#sortable li span { position: absolute; margin-left: -1.3em; }
#sortable li.fixed{cursor:default; color:#959595; opacity:0.5;}
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<ul class="photos ui-sortable">
<li class="photo" data-id="11">pawal</li>
<li class="photo" data-id="12">sigma</li>
<li class="photo" data-id="13">notea</li>
<li class="photo" data-id="14">missouri</li>
<li class="photo" data-id="15">Ooops</li>
<li class="photo" data-id="16">Ratee</li>
</ul>
.each
接受迭代器变量 i
它从集合的第一个索引开始 0
并转到集合中的最后一个元素,如果你想要一个自定义value 您应该声明一个变量并将其初始化为 x 并在 .each
循环
的每次迭代中将其递增 1
更改这段代码:
jQuery('.photos').sortable({
stop: function(event, ui){
let myIncrementor = GetLowestDataIdValue(); //Custom value returned from function
$(".ui-sortable li").each(function(i, el){
$(el).attr('data-id',myIncrementor);
myIncrementor += 1; //increment it
});
}
});
function GetLowestDataIdValue(){
let lowestVal = -1;
$('.photos.ui-sortable').find('li').each(function(i, el){
if(parseInt($(el).attr('data-id')) < lowestVal || lowestVal === -1){
lowestVal = parseInt($(el).attr('data-id'));
}
});
return lowestVal;
}
我正在尝试在数据 ID 中的给定数字之间使用可排序列表 我使用了一个代码来更新药物的数据 ID。但我的代码从 1 更新到 6 我想要它作为 11 到 16 或 21 至 26 .... 所以我只希望顶部或起始数据 ID 始终是起始数据 ID 但现在它总是变成 1
jQuery('.photos').sortable({
stop: function(event, ui){
$(".ui-sortable li").each(function(i, el){
$(el).attr('data-id',$(el).index()+1);
});
}
});
#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
#sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; cursor:move; }
#sortable li span { position: absolute; margin-left: -1.3em; }
#sortable li.fixed{cursor:default; color:#959595; opacity:0.5;}
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<ul class="photos ui-sortable">
<li class="photo" data-id="11">pawal</li>
<li class="photo" data-id="12">sigma</li>
<li class="photo" data-id="13">notea</li>
<li class="photo" data-id="14">missouri</li>
<li class="photo" data-id="15">Ooops</li>
<li class="photo" data-id="16">Ratee</li>
</ul>
.each
接受迭代器变量 i
它从集合的第一个索引开始 0
并转到集合中的最后一个元素,如果你想要一个自定义value 您应该声明一个变量并将其初始化为 x 并在 .each
循环
更改这段代码:
jQuery('.photos').sortable({
stop: function(event, ui){
let myIncrementor = GetLowestDataIdValue(); //Custom value returned from function
$(".ui-sortable li").each(function(i, el){
$(el).attr('data-id',myIncrementor);
myIncrementor += 1; //increment it
});
}
});
function GetLowestDataIdValue(){
let lowestVal = -1;
$('.photos.ui-sortable').find('li').each(function(i, el){
if(parseInt($(el).attr('data-id')) < lowestVal || lowestVal === -1){
lowestVal = parseInt($(el).attr('data-id'));
}
});
return lowestVal;
}