淘先锋技术网

首页 1 2 3 4 5 6 7

如果想使用jquery实现文字点击可编辑的功能,可以使用以下代码实现:


$(document).ready(function(){
  $(".editable").click(function(){
    var text = $(this).text();
    $(this).html("");
    $(this).find("input").focus();
    $(this).find("input").blur(function(){
      var newText = $(this).val();
      $(this).parent().text(newText);
    });
  });
});

jquery文字点击可编辑

在这个例子中,我们先给需要编辑的文字添加editable类名,然后在点击事件中获取到该元素中的文本,用一个input元素将它替换掉,使之变成可编辑。在input元素失焦时,我们获取到输入的新文本,然后将该元素的文本替换为新文本就可以了。