文本字符串的用戶輸入跳過特殊字符和Javascript中

Question

的Html的每一個字後加連字符：「這是拉姆的筆」

<input type="text" placeholder="Enter page title name" id="text" style="width: 500px;" /> 
<br /> 
<br /> 
<input type="button" value="Click Me" id="button" /> 

用戶輸入::（不含雙引號）

當用戶點擊該按鈕，輸入要..

預期::「這 - 這 - 公羊筆」（不帶雙引號）

主要目的是將連字符（ - ），在每一個之間單詞並跳過其他特殊字符。

使用Javascript有可能嗎？

Answer 1

使用這段代碼。

$('#button').on('click', function() { 

    var str = $('#text').val(); 

    $('#text').val((str.replace(/[^a-z0-9\s]/gi, '').trim().replace(/[_\s]/g, '-'))); 
}) 

replace(/[^a-z0-9\s]/gi, '')只將字符串過濾爲字母數字字符。 replace(/[_\s]/g, '-')用連字符替換所有下劃線和空格。

來源正則表達式的：RegEx for Javascript to allow only alphanumeric

JSFIDDLE

Answer 2

可以使用2替代語句

str.replace(/\s+/g, "-").replace(/[^a-zA-Z\d]+/g, "") 

Answer 3

另一種方法是選擇所有文本（與空間一起）不具有特殊字符然後用-替換空格

個

$('#button').on('click', function() { 
 

 
    var str = $('#text').val(); 
 

 
    $('#text').val((str.match(/[a-zA-Z0-9\s]+/gi).join('').trim().replace(/\s+/g, '-'))); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" placeholder="Enter page title name" id="text" style="width: 500px;" /> 
 
<br /> 
 
<br /> 
 
<input type="button" value="Click Me" id="button" />