javascript - 仅返回一个

Question

好的，我正在使用 jquery mobile 创建一个移动应用程序，并且我有一个动态创建的按钮，该按钮是在用户搜索联系人时创建的。当用户找到与他/她搜索的联系人匹配的名称时，该名称将显示在动态创建的标签中。如果存在多个同名人员，结果可能会返回重复项。使用我现在拥有的代码，如果我单击按钮，我只是希望它提醒我按钮上方包含的名称。它工作正常，除非有重复，然后它会提醒所有名称，因为所有按钮都具有相同的类。

这是创建 和 按钮的循环:

    for (var i=0; i<contacts.length; i++) {
            $('#srchResults').append("<div id='resultdiv"+i+"' data-role='collapsible'><h3 id = 'nameh3"+i+"'>"+contacts[i].name.formatted+"</h3>"+"<p>"+'<a href="#"                  data-role="button" data-icon="plus" data-iconpos="notext" data-theme="c" data-inline="true" class="btnDisguise">'+'Plus'+'</a>'+'<a href="#" data-role="button" data-icon="info" data-iconpos="notext" data-theme="c" data-inline="true" class="btnInfo">'+'Info'+'</a>'+"</p></div>").trigger('create');    
    }

这是点击后的 .btnInfo 函数:

    $(document.body).on('click', '.btnInfo', function() {
    var $this = $(this),
    h3text = $this.parents().find("h3").text();
    alert(h3text);
    });

我需要找到一种方法来提醒与该按钮关联的按钮，非常感谢任何帮助，谢谢。

Answer 1

给resultdiv添加一个class属性然后使用.closest()找到被点击的按钮所属的resultdiv然后h3 里面

 for (var i = 0; i < contacts.length; i++) {
     $('#srchResults').append("<div id='resultdiv" + i + "' class='resultdiv' data-role='collapsible'><h3 id = 'nameh3" + i + "'>" + contacts[i].name.formatted + "</h3>" + "<p>" + '<a href="#"                  data-role="button" data-icon="plus" data-iconpos="notext" data-theme="c" data-inline="true" class="btnDisguise">' + 'Plus' + '</a>' + '<a href="#" data-role="button" data-icon="info" data-iconpos="notext" data-theme="c" data-inline="true" class="btnInfo">' + 'Info' + '</a>' + "</p></div>").trigger('create');
 }

然后

$(document.body).on('click', '.btnInfo', function () {
     var $this = $(this),
         h3text = $this.closest('.resultdiv').find("h3").text();
     alert(h3text);
 });

演示:Fiddle