Question

我想使用jQuery在网站上的每个输入字段的右侧动态添加一个清除按钮（一个X）。在查看了一些示例之后，所有这些都要求我更改实际的输入字段，这显然是我在整个网站中无法做到的。

我可以使用简单的jquery脚本吗？一个脚本，用于为类型＆＃34; text＆＃34;的每个输入字段添加一个清除按钮。无论上课。

谢谢！

Answer 1

您可以使用下面的选择器。

var $inputs = $('input[type=text]')

选择文本类型的所有输入，然后执行逻辑。

如果您想要执行的内部逻辑对于每个输入都不同，请使用$.each迭代输入并执行逻辑

$inputs.each(function() {

     // Perform your logic
});

Answer 2

极端草稿。

$('input[type=text]').each(function(){
   var $this = $(this);

   $('<div class="clrInput"/>').css({
       position:'absolute',
       left: $this.offset().left + $this.width() + 10, //10 for extra spacing from edge
       top: $this.offset().top,
       width: $this.height(),
       height: $this.height()
   }).text(' X ').data('inputEQ', $this.index()).appendTo('body');
});
$(document).on('click', '.clrInput', function(){
    $('input[type=text]').eq($(this).data('inputEQ')).val('');
});

And your jsFiddle

注意

要保留性能，请将document替换为最接近的静态父元素。

每个文本输入字段内的jQuery清除按钮

2 个答案: