jQuery .click在if / else语句中不起作用

时间:2013-01-22 14:50:30

标签: javascript jquery html click

我在应用程序中连接了Foursquare API。用户可以键入框以开始搜索场地,或者他们可以点击两个场地链接中的一个以用这两个场地中的一个填充相同的选择框。我无法让用户点击两个场地之一。这是我的代码:

JS:

function venueFormatSelection(venue) {

  if ( venue.name && venue.location.address ) {
    // if a user starts typing into a box, venue.name and venue.address values will  pop up for them to select from. OR in the 'else' case, they can click one of either two links
  else {

    $("#bigdrop_set").click(function () {
      return $('#bigdrop_set').attr('venue_name')
    })

    $("#bigdrop_set_2").click(function () { 
      return $('#bigdrop_set_2').attr('venue_name_2')
    })

  }
}

HTML:

<span class="which_venue" id="bigdrop_set" venue_name='foo' venue_data='FOO'><%= link_to(FOOOOO) %></span>

<span class="which_venue" id="bigdrop_set_2" venue_name_2='bar' venue_data_2='BAR'><%= link_to(BARRRR) %></span>

出于某种原因,“click to populate”JS只有在没有.click函数的情况下只包含一个'return'行时才有效:

return $('#bigdrop_set').attr('venue_name')

我的“else”语句中的代码有什么问题?谢谢!

3 个答案:

答案 0 :(得分:1)

 $(".bigdrop_set").click(function () {
  return $('#bigdrop_set').attr('venue_name')
  })

应该是:

$("#bigdrop_set").click(function () {
  return $('#bigdrop_set').attr('venue_name')
 })

当您选择ID为bigdrop_set的元素时,不是具有类bigdrop_set的元素。 ID应该是唯一的,在您的代码中,您有重复的bigdrop_set ID,应该更改。

另外,我建议绑定$(document).ready()函数上的点击元素,而不是venueFormatSelection函数。

从click函数返回值也没有多大意义。可以直接在函数中操作值,也可以将其放在另一个函数中,而不是放在click事件上。

例如:

function alertVenue(venue) {
   alert(venue)
}

$("#bigdrop_set").click(function () {
   var venue = $('#bigdrop_set').attr('venue_name')
   alertVenue(venue);
})

答案 1 :(得分:0)

你有类似

的东西
$(".bigdrop_set").click(function () {
  return $('#bigdrop_set').attr('venue_name')
})

你真的是指css类选择器.bigdrop_set然后是id选择器#bigdrop_set

答案 2 :(得分:0)

我通过使用全局变量找到了修复。怀疑它是最干净的方法,但它现在正在运作:

$("#bigdrop_set").click(function () { 
  window.clickVenue = $('#bigdrop_set').attr('venue_name');
  $(".bigdrop").select2("val", $('#bigdrop_set').attr('venue_data'));
});

$("#bigdrop_set_2").click(function () { 
  window.clickVenue = $('#bigdrop_set_2').attr('venue_name_2');
  $(".bigdrop").select2("val", $('#bigdrop_set_2').attr('venue_data_2'));
});

function venueFormatSelection(venue) {

  if (venue.name && venue.location.address) {
    var imageSource = venue.categories[0].icon.prefix.slice(0, -1) + venue.categories[0].icon.suffix;
    return "<img src='" + imageSource + "' height='20' width='20' />" + "   " + venue.name + " (" + venue.location.address + ")";
  }
  else {
    return window.clickVenue;
  }
}