jQuery 代码有时只能工作？答案

【问题标题】：jQuery code only works at times?jQuery 代码有时只能工作？
【发布时间】：2014-03-18 15:02:24
【问题描述】：

我对 jQuery 还很陌生，我一直在尝试做点什么。一般的想法是，当您单击图像时，该图像的“alt”属性会添加到其上方的段落中。

您将在下面看到我尝试使用的代码。现在，它有效，但仅在某些情况下有效。例如，我单击的第一张图片总是返回“未定义”作为替代。但如果我一直尝试点击它，有时它会给我正确的。

我的图像是可选择的，当我一次选择所有图像时，它每次都会给出正确的名称。

有其他人遇到过这个问题吗？

HTML 代码（很抱歉它是不同的语言，请问您是否需要翻译：

<div id="onzeleden">
    <p id="feedback">Tijdens "De Bluts" zagen we de beste beentjes van... 
    <span id="select-result"></span></p>
    <div id="leden">
        <abbr title="Jeroen Beckers">
            <img src="fotos%20leden/Jeroen%20transp.gif"
                     alt="Jeroen Beckers"></abbr>                
        <abbr title="Luc Verreet">
            <img src="fotos%20leden/Luc%20transp.gif"
                     alt="Luc Verreet"/></abbr>
        <abbr title="Kristel Van den Broeck">
            <img src="fotos%20leden/Kristel%20transp.gif"
                     alt="Kristel Van den Broeck"/></abbr>
        <abbr title="Jesse Op de Beeck">
            <img src="fotos%20leden/Jesse%20transp.gif"
                     alt="Jesse Op de Beeck"/></abbr>                                      
        <abbr title="Maria Bogaerts">
            <img src="fotos%20leden/Maria%20transp.gif"
                     alt="Maria Bogaerts"/></abbr>          
        <abbr title="Bruno Van Impe">
            <img src="fotos%20leden/Bruno%20transp.gif"
                     alt="Bruno Van Impe"/></abbr>
        <abbr title="Brenda De Laet">
            <img src="fotos%20leden/Brenda%20transp.gif"
                     alt="Brenda De Laet"></abbr>
        <abbr title="Els Donckers">
            <img src="fotos%20leden/Els%20transp.gif"
                     alt="Els Donckers"></abbr>
</div>

Javascript 代码：

$(function() {
    $( "#leden" ).selectable({
      stop: function() {
        var result = $( "#select-result" ).empty();
        $( ".ui-selected", this ).each(function() {
          var index = $( "#leden img" ).index( this );
          var sAlt = $(this).attr("alt");
          result.append(sAlt + ". ");
        });
      }
    });
});

【问题讨论】：

您将通过演示链接或 jsFiddle 链接获得更好的答案。

标签： javascript jquery html

【解决方案1】：

这是因为你的点击是由你的 abbr 处理的，它没有 alt 属性。

如果你只想让你的图片可选，你应该在你的可选声明中添加过滤器选项，像这样：

$(function() {
  $( "#leden" ).selectable({
     filter: 'img',
     stop: function() {
        var result = $( "#select-result" ).empty();
        $( ".ui-selected", this ).each(function() {

           var sAlt = $(this).attr("alt");
           result.append(sAlt + ". ");
        });
    }
  });
});

见小提琴：HERE

【讨论】：