如何透過 jquery 刪除字串中多餘的空白？

Question

大家好，我是名前端自學初學者！
目前想實做一個需求。

1. 在一個範圍區塊內使用者文字過多超過兩行才會隱藏多餘文字，並出現顯示更多。
2. 不到兩行是不會出現『顯示更多』的字樣的。

遇到的困難，因為使用者有的時候會出現文字中空白的情況所以導致我設定 超過 70 個字元才會出現顯示更多這個判斷是錯誤的，我有試著使用 trim() 用來消除字串的前後空白，但是文字中間的空白又該如何移除呢？
有人說可以使用正則表達式例如：str = str.replace(/\W{2,}/g, " ")
但我沒學過這個不知道該加到我的程式碼中的哪一段～


為此困擾了好幾天，不知道是否有夥伴可以給予協助，謝謝。

這是我的程式碼
https://codepen.io/hong-wei/pen/xxqWWOQ?editors=1010

Answer 1

$(function() {
  let len = 70
  $('.demo').each(function() {
    if ($(this).html().trim().length > len) {
      var str = $(this).html().substring(0, len - 1).replace(/\s+/g,"") + "<a class='more'>...顯示更多</a>";
      $(this).html(str);
    }
  });
});

“有人說可以使用正則表達式例如：str = str.replace(/\W{2,}/g, " ")
但我沒學過這個不知道該加到我的程式碼中的哪一段～”

 

可以解釋一下，str在這裏指的是你的字符串，這個replace()是字符串的方法，將你想執行這個方法的字符串再點上這個方法去渲染就可以了。

 

下次不懂這個方法怎麽用，比如這個replace()，可以直接搜replace()，去看這個方法怎麽用就可以了。正則現在不理解沒關係，能解決問題就行。上面那個答主就提供了各種去空格的方法，我這個正則就是在上面那個答主提供的鏈接去找的。