0

私は文字列を持っています、例えば

Computer > Software > Programming Language > Python
Computer > Software > Game > BT4

文字列がテキストボックスの幅に収まらない場合、次のようにスクイーズして表示したい：

Computer > Software > ...> Python
Computer > Software > Game > BT4

文字列は AJAX 応答から取得されます。jQueryでこれを達成するにはどうすればよいですか?

4

1 に答える 1

1

これはあなたの問題を解決するのに役立つかもしれません:

https://github.com/STAR-ZERO/jquery-ellipsis

あるいは

http://dotdotdot.frebsite.nl/

アップデート

これが私が思いついたものです：Jsfiddle

appendList = ['Computer', 'Software', 'Programming Language', 'Python'];
idx = -1;
$('#appendButton').on('click', function() {
    if (idx++ >= appendList.length-1)
        return;
    var inputField = $('#inputField'),
        value = inputField.val();
    inputField.val(value + ((idx == 0) ? appendList[idx]:' > ' + appendList[idx]));
        value = inputField.val();
    // Check the length based on the "size" of the input.
    if (value.length >= 30) {
         // Get the last "section"
        var startPos = (value.lastIndexOf('>')-1),      
            begStr  = value.slice(0, startPos - 1),
            saveStr = value.slice(startPos);

        // Now we need the last occurrence of '>', 
        // This will give you multiple occurrences of '...'
        var secStartPos = begStr.lastIndexOf('>')+2;

        // Or you can use these two lines, instead
        // of the ones below if you only ever want
        // one '...', but to always show the last "section"
        //
        // var secStartPos = begStr.indexOf('>')+2;
        // while ((secStartPos = begStr.lastIndexOf('>', secStartPos)+2) >= 30) { };
        //
        var secSaveStr = begStr.slice(0, secStartPos);

        // Now append '...'
        secSaveStr += '...';

        // Rebuild the string.
        var finalStr = secSaveStr + saveStr;

        inputField.val(finalStr);
    }
});

ところで、テキストボックスが「> ... >」でいっぱいになったときにこれが何をするのかわかりません:) GL

于 2013-04-13T21:00:37.703 に答える