1

したがって、Enterキーを使用して領域を操作すると、結果が追加されます。これは機能しますが、後でページを更新することもできます。

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

1 に答える 1

5

HTMLマークアップが表示されないため、推測することしかできませんが、おそらく<input>要素を。でラップしてい<form>ます。属性を指定しなくても、デフォルトで現在のURLへのGETリクエストになり、Enterキーを押すとすぐに送信されます。

解決策は、ハンドラーをフォームのsubmitイベントにバインドして、を呼び出すことpreventDefault()です。

$('form').submit(function(e){
    e.preventDefault();
});
于 2011-05-31T08:49:44.357 に答える