Question

我只是想知道Jeditable Plugin的一件事。我已经在使用它并且工作得很好但是如果我需要输入类型号怎么样？ demo examples封面：textarea，select，text和不同的事件

如果我需要在点击的事件上指定输入类型编号，那该怎么办？

这是我的代码：

    $('.click').editable(function(value, settings) { 
     console.log(this);
     console.log(value);
     console.log(settings);
     return(value);
  }, {
      event     : "click",
      submit  : 'OK',
      style  : "inherit"
 });

Answer 1

或者只是创建自己的自定义类型，如文档中的描述： http://www.appelsiini.net/2007/custom-input-types

这应该可以很好地运作：

$.editable.addInputType('number', {
  element : function(settings, original) {
      var input = $('<input type="number">');
      $(this).append(input);
      return(input);
  },
  submit : function (settings, original) {
      if (isNaN($(original).val())) {
          alert('You must provide a number')
          return false;
      } else {
          return true;
      }
  }
});

然后：

$('.edit_number').editable(page_url, 
    {
        type:   'number'
    }
);

Answer 2

好的，我已经这样做了，看起来很有效：

我先在 jquery.jeditable.js中添加了一个新的输入类型

    number: {
        element : function(settings, original) {
            var input = $('<input type="number">');
            if (settings.width  != 'none') { input.attr('width', settings.width);  }
            if (settings.height != 'none') { input.attr('height', settings.height); }
            /* https://bugzilla.mozilla.org/show_bug.cgi?id=236791 */
            //input[0].setAttribute('autocomplete','off');
            input.attr('number','off');
            $(this).append(input);
            return(input);
        }
    },

然后我在我的html页面中创建了脚本：

    $('.number').editable(function(value, settings) { 
     console.log(this);
     console.log(value);
     console.log(settings);
     return(value);
  }, { 
     type    : 'number', 
     style  : "inherit"
 });

这里是我的html

<p class="number" style="text-align: right;">000,00</p>

在Jeditable中输入类型编号

2 个答案: