jQuery Focusout输入无法正常工作

时间:2013-10-09 07:20:48

标签: javascript jquery

我正在尝试在表格中创建数据的内嵌编辑,为此我将单元格中的文本更改为输入。

$(document).ready(function(){
    $('td.edit').on("click",function(){
        $(this).html("<input type=\"text\" value=\"" + $.trim($(this).text()) + "\" />");
        $(this).off();
    });
});

这很好用。

然后,当我点击时,我想用ajax写出数据,但是我似乎无法让焦点工作......

我已经尝试了以下内容,所有这些都在$(文档).ready中,都没有成功:

    $('td.edit').on("focusout","input",function(){
        alert("bye");
    });

    $('td.edit input').on("focusout",function(){
        alert("bye");
    });

    $('td.edit input').focusout(function(){
        alert("bye");
    });

    $('td.edit').on("focusout",function(){
        alert("bye");
    });

    $('td.edit').focusout(function(){
        alert("bye");
    });

4 个答案:

答案 0 :(得分:17)

试试这个,

$('td.edit').on("blur","input",function(){
    alert("finally bye");
});

如果parent td.edit不起作用,请使用document作为parent selector

$(document).on("focusout","td.edit input",function(){
    alert("finally bye");
});

Fiddle

答案 1 :(得分:2)

试试这个

 $('td.edit').on("blur",function(){
    alert("bye");
});

答案 2 :(得分:2)

你的jquery版本是什么,因为jquery1.4中添加了focusout函数 这是参考。 http://api.jquery.com/focusout/

答案 3 :(得分:0)

我知道现在可能为时已晚,但我遇到了完全相同的问题并且我解决了问题,但首先我会展示我的代码,然后再谈谈它。

    $('.price').click(function() {
      //If TD has no input (#in) element
      if(!$(this).find('#in').length) {
        //If there is any input element among children of all TD elements
        if($('#in').length) {
          //Set the input's parent's text as a value of input
          $('#in').parent().text($('#in').val());
          //Do Your AJAX using value from above
        }
        //Dynamicaly add input element
        $(this).html('<input type="number" value="'+$(this).text()+'" id="in">');
        //Set focus on input element
        $('#in').focus();
      }
    });
    $('.price').focusout(function() {
      $('#in').parent().text($('#in').val());
      //Do Your AJAX using value from above
    });

问题在于focusout事件实际上并未发生。想一想。你创建了新的input,你点击了它似乎应该触发事件。但它并不是因为input首先没有集中注意力。

我的代码中包含的另一个升级是删除正在编辑的其他表格单元格的输入,以便当时只能编辑一个(因为人们会忘记,然后“#34;繁荣&#34;发生)。” p>