2

特定の長さに制限しながら、表に URL を表示したいと考えています。URL であるため、最初と最後になりがちな最も意味のある部分を保持するとよいでしょう。この機能は、Firebug の [ネット] パネルで長い URL を表示すると確認できます。

4

3 に答える 3

5

これは簡単で汚い解決策ですが、これまでのところうまく機能しており、個々の好みに合わせて簡単に更新できます. 読みやすさと再利用のために、2 つの関数に分割されています。

この関数は、shortString以下に示す関数を利用します。URL の先頭と末尾を保持し、優先文字 (' '、'/'、'&') で切り捨てながら、URL を指定された長さ (l) 以下に短縮します。

function shortUrl(url, l){
    var l = typeof(l) != "undefined" ? l : 50;
    var chunk_l = (l/2);
    var url = url.replace("http://","").replace("https://","");

    if(url.length <= l){ return url; }

    var start_chunk = shortString(url, chunk_l, false);
    var end_chunk = shortString(url, chunk_l, true);
    return start_chunk + ".." + end_chunk;
}

この関数は、文字列の先頭 (reverse=true の場合は末尾) から開始し、許容可能な長さに達すると、切り捨てる優先ストップ文字の検索を開始します。指定された長さ (l) に達する前に停止文字が見つからない場合、文字列は最大長に切り捨てられて返されます。

function shortString(s, l, reverse){
    var stop_chars = [' ','/', '&'];
    var acceptable_shortness = l * 0.80; // When to start looking for stop characters
    var reverse = typeof(reverse) != "undefined" ? reverse : false;
    var s = reverse ? s.split("").reverse().join("") : s;
    var short_s = "";

    for(var i=0; i < l-1; i++){
        short_s += s[i];
        if(i >= acceptable_shortness && stop_chars.indexOf(s[i]) >= 0){
            break;
        }
    }
    if(reverse){ return short_s.split("").reverse().join(""); }
    return short_s;
}

例

>>> var url = "http://blog.stackoverflow.com/2011/07/its-ok-to-ask-and-answer-your-own-questions/"
>>> shortUrl(url)
"blog.stackoverflow.com/..swer-your-own-questions/"
于 2012-06-05T18:43:24.657 に答える
1

URL と URL エンコードされたローカル ファイル パスの両方で機能するメソッドを作成しました。

function pathShorten (str, maxLength, removeFilename) {
    var splitter = str.indexOf('/')>-1 ? '/' : "\\",
        tokens = str.split(splitter), 
        removeFilename = !!removeFilename,
        maxLength = maxLength || 25,
        drive = str.indexOf(':')>-1 ? tokens[0] : "",  
        fileName = tokens[tokens.length - 1],
        len = removeFilename ? drive.length  : drive.length + fileName.length,    
        remLen = maxLength - len - 5, // remove the current lenth and also space for 3 dots and 2 slashes
        path, lenA, lenB, pathA, pathB;    
    //remove first and last elements from the array
    tokens.splice(0, 1);
    tokens.splice(tokens.length - 1, 1);
    //recreate our path
    path = tokens.join(splitter);
    //handle the case of an odd length
    lenA = Math.ceil(remLen / 2);
    lenB = Math.floor(remLen / 2);
    //rebuild the path from beginning and end
    pathA = path.substring(0, lenA);
    pathB = path.substring(path.length - lenB);
    path = drive + splitter + pathA + "..." + pathB + splitter ;
    path = path + (removeFilename ? "" : fileName); 
    // console.log(tokens, maxLength, drive, fileName, len, remLen, pathA, pathB);
    return path;
}

いくつかの例： 

pathShorten("http://ok.some-bookshop.co.uk/books/horror/find.php?q=urge",35,false)
"http://ok.s...orror/find.php?q=urge"

pathShorten("http://ok.some-bookshop.co.uk/books/horror/find.php?q=urge",35,true)
"http://ok.some-book...books/horror/"

pathShorten("file:///C:/Users/johpan/OneDrive/Shared%20favorites/show must go on.mp3",55,false)
"file:///C:/Users/jo...d%20favorites/show must go on.mp3"

pathShorten("file:///C:/Users/johpan/OneDrive/Shared%20favorites/show must go on.mp3",55,true)
"file:///C:/Users/johpan/OneDr...ive/Shared%20favorites/"
于 2019-06-16T13:09:58.487 に答える