Обрезать строку чисел до определенной длины

Question

У меня есть код jquery ниже, который возвращает список идентификаторов, подобных этому 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 и так далее для каждого элемента списка, который есть на странице, у меня также есть раскрывающийся список с именем topfriendNumber. Мне нужно взять значение из выпадающего списка topfriendNumber и убедиться, что мой список идентификаторов не превышает его.

Таким образом, если в раскрывающемся списке выбрано значение 4, то должно быть разрешено только 4 числа 1 | 2 | 3 | 4

На основании этого кода вы можете помочь?

Вероятно, это можно добавить в нижнюю часть, где оно уже использует номер из выпадающего списка

<select name="topfriendNumber" id="topfriendNumber">
    <option value="3">3</option>
    <option value="6" selected="selected">6</option>
    <option value="9">9</option>
    <option value="12">12</option>
</select>

function saveOrder() {
    var serialStr = "";
    $("#topfriends li").each(function (i, elm) {
        serialStr += (i > 0 ? "|" : "") + $(elm).attr("friendID");
    });
    // alert(serialStr);   //1|2|3|4|5|6|7|8|9
    $('select[name=topfriendNumber]').change();
    $.ajax({
        url: "exampe.php/SaveListOrder",
        data: '{"ids":"' + serialStr + '"}',
        dataType: "json",
        type: "POST",
        contentType: "application/json; charset=utf-8"
    });
};


//changes the background colors depending on the amount selected from the dropdown list
$('select[name=topfriendNumber]').change(function() {
    var val = $(this).val();
    //reset style
    $('ul#topfriends > li').css("background-color", "");
    //apply to all LIs before value of select
    $('ul#topfriends > li:lt(' + val + ')').css("background-color", "red");
}).change();

Answer 1

Почему бы не остановиться на этом и даже не сгенерировать список сверх того, что вам нужно?

var needed = $('select[name=topfriendNumber]').val();
$("#topfriends li").each(function (i, elm) {
    serialStr += (i > 0 ? "|" : "") + $(elm).attr("friendID");
    if (i > needed) {
        return false;
    }
});

Answer 2

Могу ли я предложить сначала использовать массив для хранения заказа:

function saveOrder() {
    var serials = []; // create an empty array
    $("#topfriends li").each(function (i, elm) {
        serials.push( $(elm).attr("friendID") ); // add Friend ID
    });

    // quick way to get your old format string
    // alert(serials.join("|"));   //returns: 1|2|3|4|5|6|7|8|9

    // assuming this is where that "number" is. 
    var $numberSelect = $('select[name=topfriendNumber]');

    var numOfFriends = parseInt($numberSelect.val(),10); // get the value
    if (serials.length<numOfFriends) numOfFriends = serials.length;

    // get an array from 0, numofFriends in length.
    var serialStr = serials.slice(0, numOfFriends).join("|");
    // 1|2|3|4 if numOfFriends is 4.

    // ....
};

Если вместо этого вы начинаете со строки:

 function getListItems(listStr, length) {
   var parts = listStr.split("|"); // split the string up into an array.
   if (!length || (parts.length<length)) return parts.join("|");
   return parts.splice(0,length).join("|");
 }

 alert(getListItems("1|2|3|4|5|6|7|8|9", 4)); // 1|2|3|4

Ответ VoteyDisciple поднимает хороший вопрос - вам не нужны все идентификаторы друзей.

function saveOrder() {
    // assuming this is where that "number" is. 
    var $numberSelect = $('select[name=topfriendNumber]');
    var numOfFriends = parseInt($numberSelect.val(),10); // get the value

    var serials = []; // create an empty array
    $("#topfriends li").slice(0,numOfFriends).each(function (i, elm) {
        serials.push( $(elm).attr("friendID") ); // add Friend ID
    });

    var serialStr = serials.join("|");
    //....
 }

Answer 3

var newSerialStr = serialStr.split('|').splice(0,topfriendNumber).join('|');