jQuery KeyUp导致页面刷新

Question

因此，使用带有区域的区域应该添加一个结果，它可以工作，但也可以刷新页面。

var targetX, targetY; 
var tagCount = 0; 
$(function(){ 
$('#tag').live('click', function(){ 
    var iid = $(this).attr('p'); 
    var img = $('#img-'+iid); 
    $(img).wrap('<div id="tag-wrapper"></div>'); 
    $('#tag-wrapper').css({width: $(img).outerWidth(), height: $(img).outerHeight()}); 
    $('#tag-wrapper').append('<div id="tag-target"></div><div id="tag-input">Name<input type="text" id="tag-name"><span id="savetag">Save</span> <span id="canceltag">Cancel</span></div>'); 
    $(img).click(function(e){ 
     mouseX = e.pageX - $('#tag-wrapper').offset().left; 
     mouseY = e.pageY - $('#tag-wrapper').offset().top; 

     targetWidth = $('#tag-target').outerWidth(); 
     targetHeight = $('#tag-target').outerHeight(); 

     targetX = mouseX - targetWidth/2; 
     targetY = mouseY - targetHeight/2; 

     inputX = mouseX + targetWidth/2; 
     inputY = mouseY + targetHeight/2; 

     if($('#tag-target').css('display')=='block'){ 
      $("#tag-target").animate({left: targetX, top: targetY}, 500); 
      $("#tag-input").animate({left: inputX, top: inputY}, 500); 
     }else{ 
      $("#tag-target").css({left: targetX, top: targetY}).fadeIn(); 
      $("#tag-input").css({left: inputX, top: inputY}).fadeIn(); 
     } 

     $('#tag-name').focus(); 
     $('#canceltag').click(function(){ 
       closeTagInput(); 
     }); 
     $('#savetag').click(function(){ 
      alert($('#tag-name').val()); 
     }); 
     $('#tag-name').live('keyup', function(e){ 
      if (e.keyCode == 13){ 
       $('#savetag').click(); 
       return false; 
      } 
     }); 
    }); 
}); 
}); 

Answer 1

由于我们没有看到你的HTML标记，我只能猜测，但最有可能你有你的<input>元素包裹在<form>。即使您未指定任何属性，它也会默认为对当前URL的GET请求，并且只要您按输入密钥，它就会立即提交。

解决方法是将处理程序绑定到窗体的submit事件并调用preventDefault()。

$('form').submit(function(e){ 
    e.preventDefault(); 
});