2014-12-28 3 views
-1

диалог JQuery не работает при нажатии клавиши Enter

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
 
<form action="" id="formID" name="formID" > 
 
    <input type="text" id="filename" class="validate[required]"/> 
 
    <script type="text/javascript"> 
 
     $('#filename').keypress(function(event){ 
 
      var keycode = (event.keyCode ? event.keyCode : event.which); 
 
      if(keycode == '13'){ 
 
       alert("Enter"); 
 
       var val = $("#filename").val(); 
 
       if (val != '') {       
 
        var rev_str = val.split('').reverse().join('');    
 
        var char0 = rev_str.charAt(0); 
 
        var char1 = rev_str.charAt(1); 
 
        var char2 = rev_str.charAt(2); 
 
        var char3 = rev_str.charAt(3); 
 
        var sumchar = char0 + char1 + char2 + char3; 
 
        alert(sumchar); 
 
        if (sumchar != "txt.") { 
 
         if (sumchar != "TXT.") { 
 
          alert(sumchar + " " + "1"); 
 
          $("#dialogmsg").dialog({ 
 
           modal : true, 
 
           draggable : false, 
 
           resizable : false, 
 
           show : 'blind', 
 
           hide : 'blind', 
 
           width : 200, 
 
           dialogClass : 'osx', 
 
           buttons : { 
 
            " Back " : function() { 
 
             $(this).dialog("close"); 
 
             $("#filename").focus(); 
 
             $("#filename").val(""); 
 
            } 
 
           } 
 
          }); 
 
         } else { 
 
          alert("salam1"); 
 
          $("#formID").submit(); 
 
         } 
 
        } else { 
 
         alert("salam2"); 
 
         $("#formID").submit(); 
 
        } 
 
       } 
 
      } 
 
      event.stopPropagation(); 
 
     }); 
 
    </script> 
 
    
 
    <button type="button" id="click"> OK </button> 
 
</form> 
 
<div id="dialogmsg" class="dialogmsg" title=" Warning " style="display: none;" 
 
    align="center"> 
 
    <span style="color: red;"> Is Not Valid </span> 
 
</div>

+0

Что все ГГ? Можете ли вы отформатировать это так, чтобы оно было читаемым? –

+1

Было бы намного проще иметь кнопку отправки, а затем вызвать вашу функцию onSubmit. –

+0

или обычная кнопка и onChange – rupps

ответ

1

Вам нужно включить библиотеку JQuery UI и тему CSS для диалога работать.

Обратите внимание, что .dialog() является частью пользовательского интерфейса jQuery.

Рабочий фрагмент кода:

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" /> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script> 
 

 
<form action="" id="formID" name="formID" > 
 
    <input type="text" id="filename" class="validate[required]"/> 
 
    <script type="text/javascript"> 
 
     $('#filename').keypress(function(event){ 
 
      var keycode = (event.keyCode ? event.keyCode : event.which); 
 
      if(keycode == '13'){ 
 
       alert("Enter"); 
 
       var val = $("#filename").val(); 
 
       if (val != '') {       
 
        var rev_str = val.split('').reverse().join('');    
 
        var char0 = rev_str.charAt(0); 
 
        var char1 = rev_str.charAt(1); 
 
        var char2 = rev_str.charAt(2); 
 
        var char3 = rev_str.charAt(3); 
 
        var sumchar = char0 + char1 + char2 + char3; 
 
        alert(sumchar); 
 
        if (sumchar != "txt.") { 
 
         if (sumchar != "TXT.") { 
 
          alert(sumchar + " " + "1"); 
 
          $("#dialogmsg").dialog({ 
 
           modal : true, 
 
           draggable : false, 
 
           resizable : false, 
 
           show : 'blind', 
 
           hide : 'blind', 
 
           width : 200, 
 
           dialogClass : 'osx', 
 
           buttons : { 
 
            " Back " : function() { 
 
             $(this).dialog("close"); 
 
             $("#filename").focus(); 
 
             $("#filename").val(""); 
 
            } 
 
           } 
 
          }); 
 
         } else { 
 
          alert("salam1"); 
 
          $("#formID").submit(); 
 
         } 
 
        } else { 
 
         alert("salam2"); 
 
         $("#formID").submit(); 
 
        } 
 
       } 
 
      } 
 
      event.stopPropagation(); 
 
     }); 
 
    </script> 
 
    
 
    <button type="button" id="click"> OK </button> 
 
</form> 
 
<div id="dialogmsg" class="dialogmsg" title=" Warning " style="display: none;" 
 
    align="center"> 
 
    <span style="color: red;"> Is Not Valid </span> 
 
</div>

Readup: .dialog() | jQuery UI

Смежные вопросы