Question

上下文：我正在使用jQuery的自动完成插件触发其下方的show / hide元素。 问题：仅在输入框中输入文本时触发事件，而不是从自动完成列表中选择标记时触发事件。

这是我的代码：

    <input name="Category" id="tags">
    <br>
    <div id="Sub_Level2">
        Sub Category
        <select name="SubCategory" required>
            <option value="1">Item 1</option>
            <option value="2">Item 2</option>
        </select>
    </div>

div＃Sub_Level2根据输入框内输入的文本显示/隐藏。

 $('input[name=Category]').keyup(function () {
        if ($(this).val() == "Green")
            $('#Sub_Level2').show();
        else
            $('#Sub_Level2').hide();
    });

这样可行，但是从自动完成框中选择标记“绿色”，显示/隐藏不起作用。它只在键入时才有效。

当用户单击自动完成框上的标记时，如何调整此代码以触发＃Sub_Level2 div的显示/隐藏事件。

提前致谢。

Answer 1

您需要在jquery自动完成选择回调函数中触发相同的keyup事件。请查看此示例FIDDLE：https://jsfiddle.net/kameeshwaran/m96nseh4/3/

function myRH(){
  var risikoHoehe = parseInt(document.getElementById('input2').value);
  alert(risikoHoehe);
}

Answer 2

    $(document).ready(function() {
      $("#tags").autocomplete({
        select: function(event, ui) {            

          if (ui.item.value == "Green")
          $('#Sub_Level2').show();
        else
          $('#Sub_Level2').hide();
        }
      });
    });

    $(function() {
      var availableTags = ["Green", "Blue"];

      $("#tags").autocomplete({
        source: availableTags
      });
    });

jQuery自动完成选择触发事件

2 个答案: