Question

我想要一些帮助。这是我的JsFiddle：https://jsfiddle.net/Mirawen/q59nqh2z/

function keyPress(keyEvent)
{  
  if (keyEvent.which == 13)
    MainFunction();
}

function MainFunction()
{
  alert("Hello World");
}

var arrSource = ["foo", "foooo", "foooooo", "bar", "barr", "barr"];

$(document).ready(function() {
  $("#txtSearch").autocomplete({
    source: arrSource,
    minLength: 1,
    select: function (event, ui)
    {
      MainFunction(); 
    }
  });
});

当我按回车键时，我想拨打MainFunction()，并在从自动填充中选择项目时调用此功能关键是，当我选择一个项目并按回车键时，MainFunction()被调用两次我不知道如何解决这个问题。

感谢您的回答！

Answer 1

我认为你在同一个事件上调用了两次相同的函数，所以它调用main函数两次。即使您按Enter键，它也是一个按键/键盘/键盘事件。因此，当文档准备就绪时，它已经被调用一次并在您的回车键事件中被调用。

Answer 2

function addEnterKeyHandler()
{ 
	$( "#txtSearch" ).keypress(function( event ) {
    if ( event.which == 13 ) {
       MainFunction();
    }
  });
}

function removeEnterKeyHandler(){
	$('#txtSearch').unbind("keypress");
}

function MainFunction()
{
	alert("Hello World");
}

var arrSource = ["foo", "foooo", "foooooo", "bar", "barr", "barr"];

$(document).ready(function() {
	addEnterKeyHandler();
  $("#txtSearch").autocomplete(
    {
        source: arrSource,
        minLength: 1,
        selecting: function(event, ui){        	
        	canPressEnter = false;
          
        },
        select: function (event, ui)
        {
        	removeEnterKeyHandler();
          MainFunction();
          addEnterKeyHandler();
        }
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script   src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"   integrity="sha256-xNjb53/rY+WmG+4L6tTl9m6PpqknWZvRt0rO1SRnJzw="   crossorigin="anonymous"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css">

<div>
  <input type="text" id="txtSearch" onkeypress="keyPress(event);" />
  <button type="button" title="Search" onclick="MainFunction();">Search
  </button>
</div>

Answer 3

所以我似乎解决了我的问题！

在我的MainFunction（）中，我使用async false进行了AJAX调用（ASP.NET）。我试图将此调用异步更改为true。现在，只触发事件autocompleteselect！但是，我不知道为什么keypress不再被触发。我会继续查找并编辑此答案，如果我发现为什么async false也会在keypress之后触发autocompleteselect，以防其他人遇到同样的问题。

在select上自动完成jQueryUI双重调用功能，然后按Enter键

3 个答案: