jQuery UI样式文本输入框

Question

jQuery UI使按钮看起来很漂亮$('button').button();.

文本输入框是否有等价物？

Answer 1

没有什么可以阻止你做$("input").button()...我喜欢这个:

$('input:text, input:password')
  .button()
  .css({
          'font' : 'inherit',
         'color' : 'inherit',
    'text-align' : 'left',
       'outline' : 'none',
        'cursor' : 'text'
  });

一个更完整的例子.

Answer 2

将类添加ui-corner-all到输入中,并使用CSS对输入进行后期样式设置.

$('input').addClass("ui-corner-all");

http://jsfiddle.net/TTShr/

Answer 3

我知道这是旧的.但是,如果有人只是想让他们的输入样式看起来更UIish,只需添加以下类:$('input').addClass("ui-widget ui-widget-content ui-corner-all");

您也可以对类进行硬编码.

Answer 4

总结一下,我想添加我的实现:

$('input:text, input:password, input[type=email]').button()
  .addClass('ui-textfield')
  .off('mouseenter').off('mousedown').off('keydown');

CSS将是:

.ui-textfield {
    font: inherit;
    color: inherit;
    background: none;
    text-align: inherit;
    outline: none;
    cursor: text;
}

在这里看到:http://jsfiddle.net/UXdLQ/1544/