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(); 
});