自动完成下拉框 - 点击/按回车键提交

Question

我在某处找到了一段完美适合我的自动完成脚本，但是有一件事情我不知道如何改变。当您在下拉菜单中单击某个选项时，它不会提交此字符串，您必须单击以选择该字符串，然后单击提交按钮或按Enter键。我希望这个下拉自动完成可以在单击或按Enter键时提交所选字符串。以下是代码：

        <link rel="stylesheet" href="ac.css" />    
        <script src="./java/jquery182.js"></script>    
        <script src="./java/jqueryui.js"></script>    
        <script>    
        $(function() {        
        var availableTags = [            
        "Car",   
        "Gun",
        "Apple",
        "Example"]; 

         $( "#txt" ).autocomplete({            
         source: availableTags        
         }); 
         });   
         </script>

        <script type="text/javascript"> 
        <!-- 
        function enter(e){ 
        if(e.keyCode == 13) 
        { 
        doSomething(); 
        return false; 
        } 
        } 
        //--> 
        </script> 


<input class="ui-widget" id="txt" type="text" onkeypress="return enter(event);">
<button type="button" id="btn" onclick="doSomething()">Submit</button>

必须有函数doSomething();，因为我需要它。这个函数：onkeypress="return enter(event);"是用来当按下回车键时，将值提交给doSomething();函数的。有两个JavaScript文档（jquery182.js和jqueryui,js），大约有10,000行代码，所以我不得不在这里上传它们：http://speedy.sh/a67xR/java-files.zip希望有人能帮我解决这个问题。

- Dreadlord

Answer 1

您需要在调用autocomplete时配置onclick/select行为，尝试使用以下代码：

$( "#txt" ).autocomplete({            
    source: availableTags,
    select: function(event, ui) {
        $(event.target).val(ui.item.value);
        doSomething();
        return false;
    }
});

- st3inn

---

尝试过，并且它只在Firefox和Opera浏览器中按“Enter”键时有效，但是当点击时，在任何浏览器上都没有反应。 - Dreadlord

页面加载完成后的HTML是什么样子的（即autocomplete()函数完成后）？我猜它与jquery ui页面上的演示不同，因此我的选择器不准确。 - st3inn

你可以尝试在 $("#address").autocomplete({ source:availableTags }); 后面加上 $("#ui-id-1 li a").on('click', function() { codeAddress(); });。 - st3inn

你必须在调用“自动完成”时进行配置...请查看编辑后的答案（稍后）。 - st3inn