JavaScript实现点击可编辑

最新推荐文章于 2024-01-13 10:48:37 发布

wlchn

最新推荐文章于 2024-01-13 10:48:37 发布

阅读量1.4k

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/wlchn/article/details/50234121

版权

JavaScript 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

  function editElement(element, captcha_id){

    var oldhtml = element.innerHTML;
    var txt = (element.innerText === '点击添加') ? '' : element.innerText
    var newobj = document.createElement('input');
    newobj.type = 'text';
    newobj.value = txt
    newobj.onblur = function(){

      if(this.value == undefined || this.value == null || this.value == '')
        element.innerHTML = oldhtml;
      else{
        element.innerHTML = this.value
        if(this.value != txt){
          var true_value = this.value;
          $.ajax({//异步更新
            url: '/admin/captchas/' + captcha_id,
            type: 'PUT',
            data: {captcha: {"true_value": true_value}},
            success: function(data) {
              if(!data.success){
                element.innerHTML = oldhtml;
                alert("操作失败");
              }
            }
          });
        }
      }
    }
    element.innerHTML = '';
    element.appendChild(newobj);
    newobj.focus();
  }