点击ENTER后,.ajax()刷新页面

时间:2012-02-19 02:51:30

标签: javascript jquery ajax

我使用ajax用新文件夹更新数据库,但是在命中ENTER后刷新页面。 在我的表格上我有onkeypress="if(event.keyCode==13) savefolder();" 这里是我的javascript代码:它的作用基本上是在你输入后调用函数savefolder,savefolder然后通过ajax发送请求将文件夹添加到db。问题是刷新页面...我希望它保持在同一页面上。 有什么建议?谢谢

<script>


 function savefolder() {

var foldername= jQuery('#foldername').val(),
    foldercolor= jQuery('#foldercolor').val();
//  ajax request to add the folder
            jQuery.ajax({   
                type: 'get',
                url: 'addfolder.php',
                data: 'foldername=' + foldername + '&foldercolor=' + foldercolor,       
                beforeSend: function() { alert('beforesend');}, 
                success: function() {alert('success');}
            });

return false;
}
</script>

3 个答案:

答案 0 :(得分:2)

这是有效的:

<form>
    <input type="submit" value="Enter">
    <input type="text" value="" placeholder="search">
</form>

function savefolder() {
    var foldername= jQuery('#foldername').val(),
        foldercolor= jQuery('#foldercolor').val();

    jQuery.ajax({   
        type: 'get',
        url: '/echo/html/',
        //data: 'ajax=1&delete=' + koo,       
        beforeSend: function() {
            //fe('#r'+koo).slideToggle("slow");
        },
        success: function() {
            $('form').append('<p>Append after success.</p>');
        }
    });

    return false;
}

jQuery(document).ready(function() {
    $('form').submit(savefolder);
});

http://jsfiddle.net/TFRA8/

您需要检查处理过程中是否有任何错误(Firebug或Chrome控制台可以提供帮助)。就目前而言,您的代码格式不正确,因为$(document).ready()永远不会在问题中包含的代码中关闭。

答案 1 :(得分:1)

表单提交时只需stop the propagation of the event

jQuery(document).ready(function($) {
  $("#whatever-form-you-are-pulling-your-values-from").submit(function(event) {
    var foldername = $('#foldername').val();
    var foldercolor = $('#foldercolor').val();

    event.stopPropagation();

    //  ajax request to add the folder
    $.ajax({
      type: 'get',
      url: '../addfolder.php',
      data: 'ajax=1&delete=' + koo,       
      beforeSend: function() { fe('#r'+koo).slideToggle("slow"); }, 
      success: function() {  }
  });
});

答案 2 :(得分:-1)

由于默认情况下表单上的输入按钮会提交表单,因此您不仅需要使用自己的代码处理此表单,还需要在之后取消该事件。

请尝试使用此代码:

onkeypress="if(event.keyCode==13) {savefolder(); return false;}"

onkeypress事件将是javascript的返回值,并且只有在它返回true时才会继续它的事件。