How to edit and update <td> value when double click Jquery

Here in your case you need .stopPropagation(): http://jsfiddle.net/jFycy/

$(function () {
    $("#div table td").dblclick(function (e) {
       e.stopPropagation();      //<-------stop the bubbling of the event here
       var currentEle = $(this);
       var value = $(this).html();
       updateVal(currentEle, value);
    });
});

function updateVal(currentEle, value) {
  $(currentEle).html('<input class="thVal" type="text" value="' + value + '" />');
  $(".thVal").focus();
  $(".thVal").keyup(function (event) {
      if (event.keyCode == 13) {
          $(currentEle).html($(".thVal").val().trim());
      }
  });

  $(document).click(function () { // you can use $('html')
        $(currentEle).html($(".thVal").val().trim());
  });
}

Instead doing click on body do the event on document or html which is the parent elem of all others elems.

Fixed the last answer. by checking who triggered the event i can prevent the double click issue on the input.

Also, with the .off('click') you dont have the problem where every td you updated before changes with the last one.

$(function () {
    $(".inner").dblclick(function (e) {
        if($(event.target).attr('class')!="thVal")
            {
                e.stopPropagation();
                var currentEle = $(this);
                var value = $(this).html();
                updateVal(currentEle, value);
        }
    });
});

function updateVal(currentEle, value) {
    $(document).off('click');
    $(currentEle).html('<input class="thVal" type="text" value="' + value + '" />');
    $(".thVal").focus();
    $(".thVal").keyup(function (event) {
        if (event.keyCode == 13) {

            $(currentEle).html($(".thVal").val());
        }
    });

    $(document).click(function () {

            if($(event.target).attr('class')!="thVal")
            {
                $(currentEle).html($(".thVal").val());
                $(document).off('click');
            }

    });

}

I know its an old topic... but the answer that posted here didnt worked well because of the click event on the input, I took the answer and modified it

$(".daily-signals > tbody > tr > td").dblclick(function (e) {
    e.stopPropagation();      //<-------stop the bubbling of the event here
    var currentEle = $(this);
    var value = $(this).html();
    console.log('fire!');
    updateVal(currentEle, value);
});

function updateVal(currentEle, value) {
    $(currentEle).html('<input class="thVal" type="text" value="' + value + '" />');
    var thVal = $(".thVal");
    thVal.focus();
    thVal.keyup(function (event) {
        if (event.keyCode == 13) {
            $(currentEle).html(thVal.val());
            save(thVal.val());
        }
    });

    thVal.focusout(function () {
        $(currentEle).html(thVal.val().trim());
        return save(thVal.val()); // <---- Added missing semi-colon
    });

}

function save(value) {
    console.log(value);
}

the save function will make the ajax request