如何獲取jQuery中的最終粘貼文本？

我想在用戶正在編寫或粘貼文本時修剪一個字段中的文本，下面的代碼很好，但只有一個問題，當用戶選擇所有文本來替換它與粘貼文本或把光標在裏面插入粘貼文本，代碼在最後重複當前值+新值，我該如何解決它？如何獲取jQuery中的最終粘貼文本？

$(document).on('paste', "input[type='text'], textarea", function(e) { 

      let val = $(this).val();    
      val = val.trim(); 
      val = val.replace(/(?:^\s+|\s+?(\s))(\S+)/g, "$1$2"); 
       val = val.replace(/\s+(\s)$/, "$1"); 
      $(this).val(val); 

    });

我相信什麼，我需要做的是正常粘貼，得到最終的粘貼的文本和修剪它，但這是如何得到最終的粘貼的文本的問題？你能幫我嗎？

來源

2016-12-01 Great Sphinx

在'input'的'blur'事件中進行修剪，然後簡單地將該值重置爲修剪後的舊值。 –

@ScottMarcus我不想使用模糊，我希望用戶按CTRL + V他喜歡的地方，文本被修剪。 –

您意識到Ctrl + insert和Right Mouse上下文菜單以及其他可能存在的粘貼值的可能性？ – Theo

簡言之，粘貼事件不是流水線允許您即時更改粘貼文本。您可以訪問剪貼板，但從中獲取數據有點具有挑戰性，因爲questionable browser support不僅適用於粘貼事件，而且適用於所述事件中的剪貼板數據。

的onChange或的onblur是你最好的賭注，因爲這是一個偉大的時間來更新你的價值觀用戶粘貼其價值甚至後：

$("input[type='text'], textarea").bind('blur', function(e) { 
     $(this).val($.trim($(this).val())); 
});

這將工作，無論他們在空格輸入或粘貼如果它必須被粘貼，那麼你可能想要改變上面的和粘貼事件，但是粘貼事件只是設置一個像「valueIsPasted」這樣的共享布爾值爲true，然後你可以只做上面的事情當這個值是真的。我不喜歡這種解決方案，但不幸的是，粘貼支持並不好。最重要的是，這仍然不能在IE中使用，它不支持粘貼事件。

更新：

貌似W3Schools begs to differ瀏覽器的支持;不過，我仍然認爲onChange或onBlur是您最好的投注方式，因爲一旦用戶編輯完價值或完成控制後，您可以改變價值，並確實有效。看看我的codepen。

來源

2016-12-01 17:59:29

偉大的答案！謝謝！（e） –

我的答案是：$（document）.on（'keyup'，'input [type ='text']，textarea「，function（e）{if（isCtrlV（e））{ \t \t { \t \t \t $（this）。觸發器（ '變更'）; \t \t} \t \t // \t}）; \t \t $（文件）。在（ '改變'，「輸入[類型= '文本']，文本區域」，函數（E）{ \t \t //e.preventDefault（）; \t \t讓VAL = $（本）.VAL（）; \t \t VAL = val.replace（？/（：^ \ S + | \ S +（\ S））（\ S +）/克，「$ 1 $ 2」）; \t \t VAL = val.replace（/ \ S +（\ S）$ /，「$ 1」）; \t \t $（本）.VAL（VAL）; \t \t}）;' –

@CristianCrishk我建議'blur'到你和你說你不想使用它。我的答案在下面解決了你的問題，並在你說你想要它運行時保持代碼運行。 –

問題是您的修剪代碼首先運行（導致數據的一個副本放置在元素中），並且粘貼發生在第二個位置（導致數據的第二個副本在末尾）。

如果我們推遲修剪代碼，這個問題很簡單地解決：

$("#txtInput, textarea").on('paste', function(e) { 
 
    // Store the invocation context (the input element) 
 
    // because it will change in the setTimeout 
 
    var ctx = this; 
 

 
    // Wait 1/10th of a second before trimming the data 
 
    // This will allow the paste to complete normally. 
 
    setTimeout(function(){ 
 
    $(ctx).val($(ctx).val().trim());    
 
    }, 100); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="txtInput" size="40" value=" there are leading and trailing spaces here "> 
 
<textarea></textarea>

來源

2016-12-01 17:39:45

如何獲取jQuery中的最終粘貼文本？

回答

相關問題