TEXTBOX限制符號，字符和數字

Question

我在限制中遇到困難文本框值。

該文本框不應該允許除"?*,"以外的符號。

例：A123?*,B456?*,C789?*,D126?*,E?*666

之後和逗號之前(,)僅10 Characters/Symbols/Numbers是允許的。

只有54 characters允許在文本框內包括逗號。

只有4 comma's允許在TEXTBOX內。

可能出現的文本框中輸入：ABC?12345*,A?BC*12345,A???1234**,?*C?12345*,ABC?123***

另外，符號和字符是可更換的，無論是在開始 - 符號可能出現或字符或數字。

請檢查圖像以獲得更多解釋。

我試圖限制與其他符號和允許的逗號，但我面臨困難與10個字符限制，並允許符號和字符數。

//<![CDATA[ 
window.onload = function() { 
    /*var f = document.getElementById('textbox_restrict'); 
    f.addEventListener('keyup', function(evt){ 
    alert("Vinayagam"); 
    var regex = /[^a-zA-Z0-9]/; 
    if(regex.test(this.value)) { 
    this.value = this.value.replace(regex, '') 
    } 
    });*/ 
    $('#textbox_restrict').keypress(function(e) { 
     $('#backgroundPopup').animate({'opacity': 0.0, 'display': 'none'}); 
     this.value = this.value.replace(/[^0-9a-zA-Z\*\?\{0,12}]/g, '').toUpperCase(); 
    }); 

}//]]> 

$(function() { 
    $('body').on('keyup', 'input[id^="textbox_restrict"]', function() { 
     this.value = this.value.replace(/[^0-9a-zA-Z\*\?]/g, '').toUpperCase(); 
    }); 

    $('#search').live('click', function() { 
    }); // End of save click function 
}); // End of function 

I also took reference to this Question but the senario is different: How restrict textbox in C# to only receive numbers and (dot "." or comma ","), after "." or "," only allow 2 number characters

Regex Replace anything but numbers and lowercase

jQuery keyup() illegal characters

請諮詢我！我有點困惑實施它。

Answer 1

也許最好不要試圖一次完成所有的東西。爲了簡化每個階段，我把這個任務分成了幾部分。只需將以下代碼片段添加爲keyup或更確切的說是oninput事件處理程序到您的input。

keyUp = function() { 
    var n, parts, temp, 
     text = this.value, 
     caretPos = this.selectionEnd; // Stores the caret position 
    parts = text.split(','); // Creates an array of comma separated values 
    while (parts.length > 5) { // Limits the array length to 5 i.e only 4 commas allowed 
     parts.pop(); 
    } 
    for (n = 0; n < parts.length; n++) { // Iterates through each comma separated string 
     parts[n] = parts[n].substring(0, 10); // Limits the string length to 10 
     temp = parts[n].match(/[0-9a-zA-Z\*\?]/g); // Creates an array of acceptable characters in the string 
     if (temp) { 
      parts[n] = temp.join(''); // Adds the accepted value to the original 
     } else { // If not value, add empty to the original 
      parts[n] = ''; 
     } 
    } 
    this.value = parts.join(',').toUpperCase(); // Creates a new acceptable value to the input 
    this.setSelectionRange(caretPos, caretPos); // Returns the caret to the original position 
    return; 
} 

現場演示jsFiddle。

EDIT

刪除字符串剿至54中的字符串的中間添加字符時要避免在字符串的末尾意外刪除的字符。增加else這將在未找到可接受的值的情況下添加空字符串。看起來像oninput將是這個代碼更好的事件。

編輯II

增加了插入位置返回到原來位置後編輯在它的中間的字符串。當用鼠標粘貼文本時不完美，但似乎在鍵盤輸入時起作用。 （小提琴鏈接已更新。）

Answer 2

這個怎麼樣正則表達式，

/^(?:[a-z\d?*]{1,10}(?:,|$)){1,5}$/i 

從字符串的開始，允許字符a-z，數字，?和*，有1和這些10，然後是一個逗號或間字符串的結尾。至少重複一次，最多重複5次。該字符串必須結束。 i標誌使a-z包括A-Z。

'A123?*,B456?*,C789?*,D126?*,E?*666'.match(/^(?:[a-z\d?*]{1,10}(?:,|$)){1,5}$/i); 
// ["A123?*,B456?*,C789?*,D126?*,E?*666"] 

應當指出的是，這不會阻止*?，?x*或*x?，也不會阻止一個逗號在字符串的結尾。