防止表单提交输入按钮

我有一个实时聊天消息系统，每当用户按下输入按钮它刷新我尝试使用的页面防止默认代码也没有为我工作....这里是代码，如果有在下面的代码中的任何问题，请让我知道，因为我完全陌生的网站编程防止表单提交输入按钮

jQuery(document).ready(function() { 
    jQuery('.btn-success').click(function() { 
     var form_name = jQuery(this).attr('title'); 
     var obj = jQuery(this); 
     jQuery(".ajax_indi").show(); 
     switch (form_name) { 
      case "npost": 
      var message = jQuery("#message").val(); 
      break; 
      default: 
      alert("something went wrong!"); 
     } 
     if((jQuery(message) == '')) 
     { 
      alert("Message Cannot be Empty"); 
      jQuery(".ajax_indi").hide(); 
      return false; 
     } else { 
     jQuery(this).attr("disabled", "disabled"); 
     jQuery(this).prop('value', 'Loading...'); 
     jQuery(this).css('cursor', 'default'); 
     } 
     var str = jQuery("#"+form_name).serialize(); 
     jQuery.ajax({ 
      type: "POST", 
      url: "chat.php", 
      data: str, 
      cache: false, 
      success: function(html){ 
       jQuery('#chat1').append(html); 
       obj.attr("disabled", false); 
       obj.prop('value', 'Post'); 
       obj.css('cursor', 'pointer'); 
       jQuery(".ajax_indi").hide(); 
       document.getElementById(form_name).reset(); 
      } 
     }); 
    }); 
});

编辑部分

<form id="npost" name="npost"> 
    <input class="form-control" placeholder="Type your message here..." 
    type="text" name="message"> 
    <input type="hidden" name="id" value="1"> 
    <span class="input-group-btn"> 
     <button type="button" class="btn btn-success" title="npost" >Send</button>

来源

2015-10-29 abhishek

.button-success是否提交按钮？请提供更多详细信息，如提交表格 –

@RahulPratapSingh是的，它是一个按钮名称 – abhishek

也把你的HTML代码 –

，如果你想从提交如果你可以使用return false的形式，以防止你想停止执行该功能并停止提交它

来源

2015-10-29 10:05:09 WisdmLabs

您需要使用preventDefault才能在单击输入时停止表单提交，因为默认情况下，当任何人按下回车键时表单将被提交。因此，使用的preventDefault这样的：

<script type="text/javascript" > 
jQuery(document).ready(function(){ 

jQuery('.btn-success').click(function(e){   // added e 
e.preventDefault();        // added this line 
var form_name = jQuery(this).attr('title'); 
var obj = jQuery(this); 
jQuery(".ajax_indi").show(); 
var message = ''; 
     switch (form_name) 
     { 

     case "npost": 
       var message = jQuery("#message").val(); 
     break; 
     default: 
     alert("something went wrong!"); 
     } 

     if((jQuery(message) == '')) 
     { 
      alert("Message Cannot be Empty"); 
      jQuery(".ajax_indi").hide(); 
      return false; 
     } else { 
      jQuery(this).attr("disabled", "disabled"); 
      jQuery(this).prop('value', 'Loading...'); 
      jQuery(this).css('cursor', 'default'); 
     } 

     var str = jQuery("#"+form_name).serialize(); 

     jQuery.ajax({ 
      type: "POST", 
      url: "chat.php", 
      data: str, 
      cache: false, 
      success: function(html){ 
       jQuery('#chat1').append(html); 
       obj.attr("disabled", false); 
       obj.prop('value', 'Post'); 
       obj.css('cursor', 'pointer'); 
       jQuery(".ajax_indi").hide(); 
       document.getElementById(form_name).reset(); 
      } 
     }); 
      }); 

     }); 
    </script>

来源

2015-10-29 10:08:10

在这里，你不应该停止形式默认操作您可以防止在此处输入键默认回答是为了防止代码。

$('#npost').on('keyup keypress', function(e) { 
    if (e.which== 13) { 
     e.preventDefault(); 
     return false; 
    } 
});

来源

2015-10-29 11:08:29

防止表单提交输入按钮

回答

相关问题