仅返回一个 <h3> 父标签的文本

Posted 2023-03-14

【中文标题】仅返回一个 <h3> 父标签的文本

【英文标题】：Return the text of only one <h3> parent tag

【发布时间】：2013-11-21 00:28:57

【问题描述】：

好的，所以我正在使用 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);
    );

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

【问题讨论】：

错字？ var $this = $(this), 应该以 ; 结尾

@DrixsonOseña：可能是错字，但并非不合语法（尽管在这种情况下缩进通常不同，h3text 在$this 下缩进）。

@DrixsonOseña 怎么打错字了？他们声明了两个变量...$this 和 h3text

@DrixsonOseña 这将使 h3text 成为一个全局变量，我确信这不是 OP 想要的

@charlietfl，不，我并不是说只是指出语法错误，而是顺便说一句：)

【参考方案1】：

给resultdiv添加一个类属性，然后使用.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