Script.aculo.us IE中的自动填充问题

时间:2008-09-20 16:32:34

标签: internet-explorer prototypejs scriptaculous autocomplete

我正在努力解决IE中Script.aculo.us自动完成控件的问题(我已经在IE6和7中尝试过了)。在加载页面后,第一个字符输入到文本框中时,建议无法显示。在初始失败之后,控件按预期工作。

我已经确认建议数据是从服务器正确返回的;问题似乎与建议元素的定位有关,因为页面上其他相对定位的元素在您希望出现建议时移出位置。

有没有人听说过这样的问题,或者对如何解决这个问题有任何建议?

编辑:为了回应Chris,我已将partialChars参数设置为1,并且该控件适用于我尝试的所有其他浏览器,这些是Firefox,Safari,Opera和Chrome的最新版本。我应该首先明确说清楚。感谢。

6 个答案:

答案 0 :(得分:5)

我确实遇到了完全相同的问题。该问题仅发生在IE(也在8.0测试版)

我试过Firefox和Chrome,没有任何问题。

根据其他人的说法,这是由HTML文件中的DOCTYPE声明引起的。点击此处:http://prototype.lighthouseapp.com/projects/8887/tickets/32-ajax-autocomplete-in-ie-with-doctype

这个bug还在ruby开发板上获得了一张票:http://dev.rubyonrails.org/ticket/11051

这两个链接都有解决问题的解决方案。

希望错误将在下一版本的prototype / scriptaculous中修复:)

答案 1 :(得分:3)

非常感谢黑客攻击。我自己使用过这个,但是对它进行了修改,只有在执行以下操作时才使用Ajax.Autocompleter。

function positionAuto(element, entry) {
    setTimeout( function() {
      Element.clonePosition('choices_div', 'text_element', {
      'setWidth': false,
      'setHeight': false,
      'offsetTop': $('text_element').offsetHeight
    } );
  }, 300);
  return entry;
}

new Ajax.Autocompleter('text_element', 'choices_div', [url to web service], {
  paramName: 'fulltext',
  minChars: 2,
  callback: positionAuto, // See above
  [etc...]

由于在实际请求发出之前调用了回调,因此在那一刻定位DIV最有意义。并确保即使窗口调整大小或滚动,DIV也能正确定位。令人抓狂的是,要让它始终如一地工作,我必须将它包装在“setTimeout()”中。没有尝试过那么多不同的时序设置,但如果有一个较低的超时阈值可行,我想知道。

在IE 8& 7并且效果很好。并与其他真实浏览器一起使用。希望这可以在处理这个问题时节省一些编码员的头痛。

答案 2 :(得分:2)

您的问题仅在IE或所有浏览器中?忽略第一个char实际上是Autocompleter的默认值。在controls.js中,有一个名为Autocompleter.Local的类,它有一个名为partialChars的字段,默认为2.该字段的文档说:

// - partialChars - 触发前输入的字符数 //部分匹配(与minChars不同,它定义了
//进行任何匹配需要多少个字符
//完全)默认为2.

答案 3 :(得分:2)

在IE8 / IE9中遇到这个问题后,我最终使用了CSS hack。这里的方法是在绝对定位的容器内强制相对位置。额外的容器是必要的,以便将选择浮动到其他元素上。

div.acwrap {
  position: absolute;
  height: 40px;
}

div.autocomplete {
  position: relative !important;
  top: -5px  !important;
  left: 0px !important;
  width:250px;
  margin:0;
  padding:0;
}

在我的HTML代码中,我使用了以下类:

<div class="acwrap">
 <div id="autocomplete_choices" class="autocomplete">
 </div>
</div>

这个想法源于此:Scriptaculous / Prototype IE 8 Autocomplete disappearing problem

答案 4 :(得分:1)

我仍然不知道究竟是什么导致了这个问题,但我已经设法拿出一个黑客来解决这个问题。我们的想法是在页面加载时执行通常导致第一个字符条目失败的处理,以便将其排除在外:

new Ajax.Autocompleter(textInputId, suggestionsHolderId, suggestionsUrl, params);

//Hack
Event.observe(window, 'load', function()
{
    try
    {
        Position.clone($(textInputId), $(suggestionsHolderId),
            { setHeight: false, offsetTop: $(textInputId).offsetHeight});
    }
    catch(e){}
});

答案 5 :(得分:1)

这是一个已知错误,其中有一个可以正常运行但尚未包含的补丁。您可以在此处详细了解:https://prototype.lighthouseapp.com/projects/8886-prototype/tickets/618-getoffsetparent-returns-body-for-new-hidden-elements-in-ie8-final#ticket-618-9