当存在HTML5占位符属性时，在Internet Explorer中的字段焦点上触发jQuery UI自动完成

HTML:

Javascript:

<input type="text" name="item" value="" id="item" class="input-xlarge" placeholder="Enter item name or scan barcode" accesskey="i"  />

$（“#项”）。自动完成({
来源：“”，
延误：10，
自动对焦：错误，
最小长度：0，
选择：功能（事件、用户界面）
{
event.preventDefault（）；
$（“#项”）.val（ui.item.value）；
$（'add#u item_form'）.ajaxSubmit（{目标：'register#u container'，beforesmit:salesBeforesmit，success:itemScannedSuccess}）；
}
});
setTimeout（function（）{$（'#item'）.focus（）；}，10）；

在Internet explorer中加载页面时，自动完成会出现一个空项值，从而产生一系列结果。如果删除占位符属性，它将按预期运行，并且在键入之前不会发出请求

如果我删除焦点事件，它也可以在Internet Explorer中工作。但是我需要把重点放在页面加载上，所以这不是一个真正的选项。我还想保留占位符文本

元素在safari、firefox和chrome中按预期运行（在键入之前没有请求）

这是虫子吗？是否有一个变通方法，以便我可以使用占位符属性

我列举了两个例子；坏的和固定的。2之间的唯一区别是存在占位符属性（在损坏的版本中）

坏掉的那个只会在IE中坏掉，在其他浏览器中也能正常工作

注：我所说的“断开”是指当聚焦于字段时，自动完成在不应该激活时被激活

---

注意：在这两个示例中，ajax的结果总是相同的。请忽略此项。

占位符表示文本框中显示了某些内容，自动完成表示当您在文本框中写入内容时，您将获得自动完成结果，现在您已经使用占位符显示了某些内容

---

首先尝试用退格将占位符删除到文本框中，然后再试一次。

亲爱的，请参阅此代码

    $( "#item" ).autocomplete({
        source: '<?php echo site_url("sales/item_search"); ?>',
        delay: 10,
        autoFocus: false,
        minLength: 0,
        select: function(event, ui)
        {
            event.preventDefault();
            $( "#item" ).val(ui.item.value);
            $('#add_item_form').ajaxSubmit({target: "#register_container", beforeSubmit: salesBeforeSubmit, success: itemScannedSuccess});
        }
    });

setTimeout(function(){$('#item').focus();}, 10);

---

这里的问题是Internet Explorer处理输入事件的方式。 输入元素（标记）的输入事件触发自动完成菜单。 第167行

如果在设置超时之前放置此代码

    $("#item").live("keydown.autocomplete",function(){
        put your code here. and try it 
        });

您将看到ie的本机输入事件是在元素的焦点上触发的。 这不会发生在chrome上。因此，这可能不是jquery的错误，而是ie的一个功能。正如您在问题中所述，这只发生在输入元素具有占位符属性时，如果没有该属性，输入事件不会在焦点上触发

在触发focus之前，我尝试为focus添加一个

one

事件处理程序来调用

preventDefault（）

，但这仍然导致输入事件触发

自动聚焦html5属性仍然导致输入事件触发

我试着用适当的html/head/body来包装代码，但没有效果

最后，作为一种解决办法

1） 我将minLength属性默认为1

document.getElementById('tags').addEventListener('input',function(ev){alert(ev.target.value);},false);

2） 在setTimeout中，我将minLength的选项设置为0

minLength: 1

这似乎适用于IE9

In

$("#tags").focus().autocomplete("minLength", 0);

在Sumit回答的复选框上工作。它可能也适用于文本框

但如果您在文本框上使用自动完成，并且不想使用minlength解决方案，您可以使用其他方法

.autocomplete({
    delay: 0,
    //minLength: 0,
    minLength: 1,
    source: $.proxy(this, "_source")                         
})`

文本框初始化后的jquery代码。

---

如果你知道我很乐意听的话，我看不出这句话怎么能用在复选框上，就像用在文本框上一样

以下代码帮助我解决了此问题：

$("your element or class tag").autocomplete("instance").menu.active = false; 

简而言之，widget为您的标签调用focus，对于标签，我们制作了一个触发函数，该函数仅被调用一次，因为通过调用blur，focus会丢失。 对IE（坏IE）来说，这是个骗局

---

也许有更好的解决办法。请将它分享给这个论坛。

这是我最初的方法

  $("your tag").autocomplete({
   source:bla-bla,
   open:function(e,ui) /*Hack for IE11*/
   {            
     $(this).focus();
   }
   })
   .one("focus",function(){/*Hack for IE11*/
     $(this).blur(); 
   });

---

我知道占位符和自动完成是什么。问题是，在InternetExplorer中，如果我设置占位符属性，当我使用javascript关注字段时，会自动完成。如果我没有设置占位符属性，它不会自动完成，直到在页面加载时键入（如预期的那样）检查占位符的字符串，如果为真，则不自动完成工作，当您按autocomplete work键时。请参阅上面我发布的两个示例。我想这可以解释问题。Live在我使用的查询版本中不起作用。我看不出这会有什么帮助。你能提供一个更好的例子吗？IE是每个web开发人员的噩梦。又一笔巨额奖金用于IE漏洞修复。：-）+1汉克斯正在做minLength:1似乎解决了问题！在IE11上，这个解决方案使我不得不在与输入的第一次交互中单击输入两次。

elm.focus(function () {
    if(elm.autocomplete("instance")){
        elm.autocomplete(opts);
    }
});