限制jquery拖放id的数量

时间:2009-08-25 21:44:19

标签: jquery ajax drag-and-drop

我在下面的代码中创建了div的拖放列表,在drop上它会返回新订单中id的列表。

我需要以某种方式为此代码添加2个功能。

1)
在下拉列表中,将有5个选项。 3,6,9,12,15当用户选择其中一个数字时,我需要突出显示div的第一个X数。如果用户选择9我需要拖放列表中的前9个div来改变背景颜色,这样你就可以知道那9个被选中了。
我还需要在下拉列表编号被更改以保存此编号时再进行另一次ajax调用 当重新加载页面时,此下拉列表将从数据库中提取数字,因此如果用户已经在数据库中保存了99,则当他们访问此页面时,脚本将在框中显示9并且已经选择了9个div

2)
在拖放部分,在拖放时,这样的值以正确的顺序返回0 | 1 | 2 | 3 | 4 | 5等等。我需要将此列表限制为仅返回前X个数字。如果下拉框选择了上面的9,那么它应该只保存前9个div的顺序。

有人可以帮忙吗?

<ul id="gallery">
    <li itemID='12'>
        <div>Photo Here</div>
    </li>
    <li itemID='23'>
        <div>Photo Here</div>
    </li>
    <li itemID='32'>
        <div>Photo Here</div>
    </li>
    <li itemID='43'>
        <div>Photo Here</div>
    </li>

    ...up to hundreds
</ul>


<script type="text/javascript">

    $("#gallery").dragsort({
        dragSelector: "li div",
        dragEnd: saveOrder
    });

    function saveOrder() {
        var serialStr = "";
        $("#gallery li").each(function(i, elm) {
            serialStr += (i > 0 ? "|" : "") + $(elm).attr("itemID");
        });
        alert(serialStr);
        // $.ajax({ url: "saveorder.php/SaveListOrder", data: '{"ids":"' + serialStr + '"}', dataType: "json", type: "POST", contentType: "application/json; charset=utf-8" });
    };

</script>

1 个答案:

答案 0 :(得分:1)

使用此css选择器: http://api.jquery.com/lt-selector/

所以:

var serialStr = "";
var list = $("#gallery li:lt(" + $("#limit").val() + ")");
list.addClass("highlight").each(function(i, elm) { ... });
alert(serialStr);