Javascript-форум - Показать сообщение отдельно

djsadd · #1 (**permalink**) 24.03.2012, 19:12

Доброго времени суток, я на этом сайте в учебнике увидел пример реализации потери фокуса, все это реализовать получилось за исключением проверки ввода символов, мне нужно проверить на правильный ввод между кавычек с таким условием [0-9_;:'!~?=+<|>] подскажите пожалуйста как это сделать.
Большое спасибо!

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Документ без названия</title>
<style>
  article, aside, figure, footer, header, hgroup, 
  menu, nav, section { display: block; }
</style>
</head>

<body>
<div id="Full_name_div" style="width: 1000px; font-family:'Palatino Linotype', 'Book Antiqua', Palatino,'serif'; font-size:14px; margin-left:15px;">
<table width="1000" border="0" cellpadding="0" cellspacing="0">
  <tr> 
    <td width="200" rowspan="2" valign="top"><div style=" margin-top:4px;text-align:right">Полное наименование<font color="#FF0000"> *</font></div></td>
    <td width="596"><div style=" margin-left:1px;text-align:left"><input type="text" name="Full_name" id="Full_name" value="Общество с ограниченной ответственностью «{NAME}»" 
size="50" maxlength="150" ></div></td>
  </tr>
  <tr>
    <td><span id='Full_name_span' style="display: none; color:#F00;"><font color="#FF0000">Поле должно содержать организационно-правовую форму и наименование в кавычках на русском языке.<br>
Например: Общество с ограниченной ответственностью «Ромашка»</font>
</span></td>
  </tr>
  </table>
</div>
 
  
<div id="Short_name_div" style="width: 1000px; font-family:'Palatino Linotype', 'Book Antiqua', Palatino,'serif'; font-size:14px; margin-left:15px;">
<table width="1000" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="200" rowspan="2" valign="top"><div style=" margin-top:4px;text-align:right">Сокращенное наименование<font color="#FF0000"> * </font></div></td>
    <td width="597"><div style="margin-left:1px;text-align:left"><input type="text" name="Short_name" id="Full_name" value="ООО «{NAME}»" 
size="50" maxlength="150" ></div></td>
  </tr>
  <tr>
    <td><span id='Short_name_span' style="display: none; color:#F00;"><font color="#FF0000">Поле должно содержать аббревиатуру ООО и сокращенное наименование в кавычках на русском языке.<br>
Например: ООО «Ромашка»</font>
</span></td>
  </tr>
</table>
</div>

<p>&nbsp; </p>
<p>&nbsp;</p>
<p>&nbsp; </p>
<script>
var Full_name = document.getElementsByName('Full_name')[0];
var Short_name = document.getElementsByName('Short_name')[0];
var errorHolder = document.getElementById('error');

Full_name.onblur = function() {
  if (isNaN(this.value)) { // введено не число
    // показать ошибку
    this.className = 'error';
	document.getElementById('Full_name_span').style.display = 'inline'
	document.getElementById('Full_name_div').style.background = '#FEE'
  }
}

Full_name.onfocus = function() { 
  // сбросить состояние "ошибка", если оно есть
  if (this.className == 'error') {
    this.className = '';
	document.getElementById('Full_name_span').style.display = 'none'
	document.getElementById('Full_name_div').style.background = ''
  }

 Short_name.onblur = function() {
  if (isNaN(this.value)) { // введено не число
    // показать ошибку
    this.className = 'error';
	document.getElementById('Short_name_span').style.display = 'inline'
	document.getElementById('Short_name_div').style.background = '#FEE'
  }
} 
Short_name.onfocus = function() { 
  // сбросить состояние "ошибка", если оно есть
  if (this.className == 'error') {
    this.className = '';
	document.getElementById('Short_name_span').style.display = 'none'
	document.getElementById('Short_name_div').style.background = ''
  }
}
}
  </script>
  
  <script>
  (function(exp){
  
  // data for inp.name, his value and his element.
  var data = {},
      // current text.
      value = '';
  
  // return unique id
  function getId(){ return (Math.random()*1e2|0).toString(32); }
  
  // setup hash
  function init(inputs){
    
    var 
        i = 0,
        curr;
    
    while((curr = inputs[i])) {
      if(curr.type == 'text' && curr.value.indexOf("{NAME}") != -1) {
        
        if(curr.name.length === 0) {
          curr.name = getId();
        }
        
        data[ curr.name ] = [ curr, curr.value.split("{NAME}") ];
        
        curr.value = "";
      }
      i += 1;
    }
  }
  
  // keypress handler
  function handler(e){
    
    e = e || window.event;
    
    var 
        el = e.target || e.srcElement,
        char,
        i;
    
    if(el.name in data) {
      
      prevent(e);
      char = getChar(e);
      
      if(char) {
        
        value += char;
          
        for(i in data){
          data[i]['0'].value = data[i]['1'].join(value);
        }
        
      }
    }
    
  }
  
  // from learn.javascript.ru
  function getChar(event) {
    if (event.which == null) { 
      if (event.keyCode < 32) return null;
      return String.fromCharCode(event.keyCode)
    }
   
    if (event.which!=0 && event.charCode!=0) {
      if (event.which < 32) return null;
      return String.fromCharCode(event.which);
    }
   
    return null;
  }

  // event cancel func 
  function prevent(e){
    if('preventDefault' in e){
      e.preventDefault();
    } else {
      e.returnValue = false;
    }
  }
  
  // main func
  exp['synchronize'] = function(inputs){
    
    init(inputs);
    
    if('addEventListener' in document) {
      document.addEventListener('keypress', handler, false);
    } else {
      document.attachEvent('onkeypress', handler);
    }
    
  };
  
})(window);
synchronize(document.getElementsByTagName('input'));

  </script>
  
</body>
</html>