使用jQuery自动完成更改图像src

时间:2011-04-05 16:28:47

标签: jquery html

我有这个jQuery自动完成功能非常有效。但是,我想这样做,以便当用户点击下拉框中的一个选项时,然后将值传送到输入字段,图像src属性将更改为输入字段中的值。我的jQuery代码如下。

$(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代码是这样的:

<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没有获得输入字段中正确值的正确值。它仅为团队变量的值提供一个字母。

有什么想法吗?

2 个答案:

答案 0 :(得分:0)

我不知道这是否真的有用,但是:

 $('#team').autocomplete(data)
      .result(function(event, item) {
          $('img#team_wallpaper').attr("src", "mlb/" +item.text+ ".png");
      });

请参阅:http://docs.jquery.com/Plugins/Autocomplete#API_Documentation 在最底层“搜索页面替换”

答案 1 :(得分:0)

您正在捕获文本字段的onchange,然后自动完成才能更新它。 您可以尝试附加到自动填充

上的选择事件
$("#team").autocomplete({ 
   source: data, 
   select: function(event,ui){alert(ui.item.value)}})