Textarea表单提交没有刷新?

时间:2014-01-10 09:23:15

标签: javascript jquery html ajax

Textarea没有提交没有刷新的表单

提交表格而不刷新的代码

$(document).ready(function(){$("#post_reply").click(function(event) {
        $.post( '../services/leave_comment.php', $("#open_status").serialize(),  
        function( data ) 
        if(data.split("::")[1]==true){
            $("#data_status").html("Commented Successfully..");     
            $("#data_status").fadeOut(3000);               document.getElementById('_comment').value='';  
            $('#_comment').html("");
            location.reload();
        }else if(data.split("::")[1]==false){
            $("#data_status").html("Error occured in Comment Submission.. Try Again..");                +       
        $("#data_status").fadeOut(3000);  
        }

    }  
);  
});

代码换班+输入换行,输入提交表格

function getCaret(el) {
    if (el.selectionStart) {
        return el.selectionStart;
    } else if (document.selection) {
        el.focus();
        var r = document.selection.createRange();
        if (r == null) {
            return 0;
        }
        var re = el.createTextRange(),
        rc = re.duplicate();
        re.moveToBookmark(r.getBookmark());
        rc.setEndPoint('EndToStart', re);
        return rc.text.length;
    }
    return 0;
}
$('.commenttextarea').keyup(function (event) {
    if (event.shiftKey && event.keyCode == 13) {
        var content = this.value;
        var caret = getCaret(this);
        this.value = content.substring(0, caret) + "\n" + content.substring(caret, content.length - 1);
        event.stopPropagation();
    } else if (event.keyCode == 13) {
        $('.commentform').submit();
    }
});

以下是 Fiddle!!

现在的问题是,提交表格后它会更新 有时输入密钥不能正常工作。

详细解释表示赞赏。

1 个答案:

答案 0 :(得分:0)

尝试此event.preventDefault()将帮助您,无需我们提交的页面刷新。当你在事件处理程序中使用ajax时,使用event.preventDefault()来阻止页面刷新。

  (document).ready(function(){$("#post_reply").click(function(event) {

   event.preventDefault(); //NOTE HERE

 $.post( '../services/leave_comment.php', $("#open_status").serialize(),  
          function( data ) 
   if(data.split("::")[1]==true){
$("#data_status").html("Commented Successfully..");     
$("#data_status").fadeOut(3000);               document.getElementById('_comment').value='';  
    $('#_comment').html("");
    location.reload();
    }else if(data.split("::")[1]==false){
        $("#data_status").html("Error occured in Comment Submission.. Try Again..");                +       
    $("#data_status").fadeOut(3000);  
    }

          }  
        );  
      }); 

添加以下代码。

$(".commentform").on("submit", function (e) {
    e.preventDefault();
});