ตรวจสอบอักษรพิเศษ เมื่อคีย์ข้อมูล (special characters)

Character Entities Cheat Sheet
ตรวจสอบ อักขระ พิเศษ

ห้ามไม่ให้ User กด special character ใน Input รวมทั้งการ copy pate ด้วย บางครั้งเราอาจมีความจำที่จะต้องการกันการคีย์ special character หรืออักขระพิเศษใน input ไม่ว่าจะเหตุผลด้านความถูกต้องของข้อมูล หรือกันการ Hack เบื้องต้น เพราะ  Hacker ชอบใช้ special characters เพื่อ Hack ข้อมูลต่างๆ บนเวพ Site หรือที่รู้จักกันว่า Cross Site Scripting (XSS หรือบางครั้งเรียกว่า CSS)  ซึ่งจริงๆ อันนี้ถ้าจะ  Hack จริงๆ มันกันไม่อยู่แต่มันสามารถกัน Bot Scan ได้ในเบื้องต้น  (แต่เอาจริงๆ เราควรป้องที่ Server Side ด้วยมันถึงจะ Save Save เพราะ JavaScript มันเป็น Client Side มันมีดีที่ Response กับ User ได้ไวแต่มันถูกแก้ไขหรือ  By Pass ได้ไม่ยากเลย)   ลองเล่น Code ข้างล่างดูครับ

ข้อควรระวัง มีหลาย Site ตัวอย่างชอบใช้ event.key ถ้า browsers รุ่นใหม่ก็ไม่มีปัญหาครับ เช่นถ้าเราพิมฑ์เครื่องหมาย + ที่ input event.key= ‘+’ แต่ถ้าเป็น IE มันจะได้ค่า ‘Add’ แทน ทางแก้ก็ให้ใช้ Function ข้างล่างแทนมันจะถูกทุก เบราว์เซอร์เพราะมันแปลง keycode เป็นตัวอักษรซึ่ง browsers  เข้าใจเกือบทุก browsers

var stringSet = String.fromCharCode(event.keyCode)

 

let SpacialCharacter = /[`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi;

//จับ Event key
$('input[type=text]').on("keypress", function(event) {

  var keyChar = String.fromCharCode(event.keyCode);

  var output = SpacialCharacter.test(keyChar);
    
  var text = $(this).val();
  
  $(this).val(text.replace(SpacialCharacter, ''));
  
 
  console.log(event.key);
  
  return !output;
});