自动完成选择：调用另一个函数

Question

我不是编码专家，所以我知道我可能犯了一个明显的错误。我使用自动完成来创建一个包含建议列表的输入字段。当我点击建议时，我现在正在尝试调用一个函数。

现在我有

$(function () {
        var Input = $("#Input").autocomplete({
            source: list,
            select: function() {
                alert('changed');
                }
            });
            Input.autocomplete('option', 'change').call(Input);
        });

我想调用一个函数而不是 alert('changed')，但它不起作用。我知道我做得对，因为我可以调用其他函数，但不是我需要的函数。这就是函数的样子

function getVariable()
  {
    var variable = document.getElementById("Input");
    var name = variable.value; 

      if (name == "A124") {
          changetoA();
      } else if (name == "B735") {
          changetoB();
      } else {
          document.getElementById("result").innerHTML = "Empty";
      }              
  };

我认为问题可能是因为我正在使用该函数调用另一个函数，因此我尝试将指令放在一个函数中，从 changetoA() 和 changetoB 到 getVariable()。还是不行。

编辑

这是我的 Input 元素的 HTML

<div id="main">
 <input id="Input" type="text"> <br/>
 <input id ="enterButton" type="button" value="Enter" onClick="getVariable()">
</div>

Answer 1

我在这里测试了代码，调用了getVariable函数。但是，由于document.getElementById("Input").value 还没有更新，我们将永远落在else... 给人的印象是什么都没发生。

您可以更改getVariable 以从args.item.value 接收name。 并删除此行：Input.autocomplete('option', 'change').call(Input);。

function changetoA()
{
	alert('changeToA');
}

function changetoB()
{
	alert('changeToB');
}
  
$(function () {
	var Input = $("#Input").autocomplete({
		source: ['A124', 'B735'],
		select: function(s,e) {
			getVariable(e.item.value);
			}
		});
		//Input.autocomplete('option', 'change').call(Input);
});
		
function getVariable(name)
{
  if (name == "A124") {
	  changetoA();
  } else if (name == "B735") {
	  changetoB();
  } else {
	  document.getElementById("result").innerHTML = "Empty";
  }              
};

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

<div id="main">
<input id="Input" type="text"> <br/>
<input id ="enterButton" type="button" value="Enter" onClick="getVariable()">