使用jQuery自动完成更改图像src [英] Change image src with jQuery autocomplete

问题描述

我有这个jQuery自动完成功能，可以正常工作.但是，我想这样做，以便当用户单击下拉框中的选项之一，然后将值传输到输入字段时，image src属性将更改为输入字段中的值.我的jQuery代码如下.

I have this jQuery autocomplete function that works terrifically. But, I wanna make it so that when the user clicks on one of the choices from the drop down box and the value is then transferred to the input field that the image src attribute will change to the value of what's in the input field. My jQuery code is as follows.

$(document).ready(function() {
  $('#team').change(function getPic() {
    var logo = $('input#team').val();
    $('img#team_wallpaper').attr("src", "mlb/" +logo+ ".png");
  });

  var data = ["Baltimore Orioles", "New York Yankees", ..., "San Diego Padres"];
  $("#team").autocomplete({ source: data });
})

我的html代码是这样:

My html code is this:

<h1 id="invite_line">
  Favorite team <br /><input type="text" id="team" class="bar" name="team" />
</h1>

<img src="mlb/mlb.png"  width="140" height="210" id="team_wallpaper"/>

由于某种原因，似乎jQuery未能获得输入字段中值的正确值.只是给团队变量的值一个字母.

For some reason, it seems as if jQuery isn't getting the correct value of what's in the input field. It's only giving a single letter for the value of the team variable.

有什么想法吗?

推荐答案

在自动完成功能可以更新文本字段之前，您正在捕获文本字段的onchange. 您可以尝试在自动填充功能上附加到select事件

You are catching the onchange of the text field before the autocomplete can update it. you can try attaching to the select event on the autocompleat

$("#team").autocomplete({ 
   source: data, 
   select: function(event,ui){alert(ui.item.value)}})

这篇关于使用jQuery自动完成更改图像src的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！