jquery ui自动完成添加跨度

我在div上使用jQuery自动完成,但我得到jquery自动添加的额外跨度

"search test" 

如何防止创建此跨度?

这是出于可访问性的原因,盲人可以“阅读”找到多少结果。 如果你真的想删除它,你可以修改源代码:

 this.liveRegion = $( "", { role: "status", "aria-live": "polite" }) .addClass( "ui-helper-hidden-accessible" ) .insertAfter( this.element ); 

但不建议这样做。

我也有同样的问题。 这就是我解决的问题…添加css规则:

.ui-helper-hidden-accessible { display:none; }

您可以通过将此事件处理程序添加到自动完成function来摆脱它:

 $(element).autocomplete({ ... create: function (e) { $(this).prev('.ui-helper-hidden-accessible').remove(); } }); 

除非你关心盲人访问我们的网页,否则删除它是没有害处的。 我尝试了display: none技巧,但这对我不起作用。

我使用CSS flex box进行布局,使用nth-child选择器,因此,这个跨度扭曲了我的列布局。

display: noneposition: absolute; top: -999999 position: absolute; top: -999999无法解决我的问题。 我必须完全从DOM中删除元素,因此,我编写了以下create事件处理程序:

 create: function (e) { e.target.parentElement.removeChild(e.target.parentElement.querySelector(".ui-helper-hidden-accessible")); } 

你真的不应该删除这个(你想浏览一个仅适用于盲人的网页而你无法访问内容吗?)…

要使网站符合ada标准并不容易。 这个范围只是所有这些内容的一小部分。

隐藏显示无元素的元素是关于ada的不良做法。 这就是为什么像facebook这样的页面通过将它们缩进到屏幕外的某个地方来隐藏一些元素:

display:none vs visibility:hidden vs text-indent:9999屏幕阅读器的表现如何?

对于ada相关的东西你可以从这里开始: http : //www.techrepublic.com/blog/web-designer/creating-an-ada-compliant-website/

也许强迫高度为0可能在这种情况下使用…

添加.css文件对我有用(当然也删除了所有span元素,但这不是一个好的解决方案):

  

这将完美地工作:

 $(document).ready(function(){ $("span").remove(); });