在填充选择选项时,在.each循环内调用truncate函数?

时间:2015-07-30 19:48:03

标签: function select truncate

我尝试动态填充select并在循环中调用truncate函数...如下所示。我想将选项文本向下发送到函数,如果长度超过20个字符,则将其截断,并在将其添加到选项并附加到选项之前将其发回。

$(function() {
    for (var i = 0; i < response.option.length; i++) {
            var truncatedText = truncate();
            var text = response.option[i].name;
            truncate(text);
            $("select").append("<option>" + truncatedText.text + "</option>");
        }
});

function truncate(text) {
    var textLength = text.length;
    if (textLength > 20) {
        text = text.substr(0, 20) + '...';
    }
    return text;

} 

1 个答案:

答案 0 :(得分:0)

在jsfiddling一段时间后,我找到了一个有效的解决方案。有更优雅的方式吗?

https://jsfiddle.net/kirkbross/pcb0a3Lg/9/

var namesList = ['johnathan', 'tim', 'greggory', 'ashton', 'elizabeth'];

$(function() {
    for (var i = 0; i < 5; i++) {
        var name = namesList[i];
        $('#names').append('<option>' + name + '</option>');
    }
    var selected_option = $('#names').find('option:selected').val();
    var truncated = truncate(selected_option);
    $('option:selected').text(truncated.new);

    $('#names').change(function(){
       var selected_option = $(this).find('option:selected').val();
       var truncated = truncate(selected_option);
        $('option:selected').text(truncated.new);
    });

});

function truncate(selected_option) {
    var nameLength = selected_option.length
    if (nameLength > 4) {
        selected_option = selected_option.substr(0, 4) + '...';
    }
    return {new: selected_option}
}