使用jQuery从当前div获取文本

Question

我有一个小型搜索引擎，在数据库中查询名称列表。 引擎最多返回5个名称。 每个人的姓名旁边都有一个按钮。 单击该按钮时，我的jQuery代码应该仅将该人的名字添加到逗号分隔的列表中。 当前，它将添加引擎提取的每个名称。 我假设我需要以某种方式利用this命令。 我感觉好像没有正确选择我的div。

问题：如何访问与按钮位于同一类中的段落的文本？

段落和按钮包含在类中。 该段有一个类。 该按钮具有一个类。

//jQuery function to add the name to my list of names
$(document).ready(function(){
    var addList = $('.addList');

    $(".addCustomer").on( "click", function() {
        customerToAdd = $('.addIndividual > .searched_name').text(); //here is where the problem lies. it comma separates every name
        addList.val($('.addList').val() + customerToAdd + ', ');
        search.val('');
    });
});

这是我的HTML包含在php中。 这保存了上面的jQuery使用的字段。

while($state = mysqli_fetch_assoc($states)) {
$customerid = $state['id'];
$customername = $state['name'];
echo "
    <div class='addIndividual' >
        <p style='float:left;' class='searched_name'>".$customername."
        </p>

        <button type='button' value=".$customername." class='btn btn-default addCustomer'>Assign List to a Class</button>
    </div>  

<hr>";

}

Answer 1

你需要改变

$('.addIndividual > .searched_name').text();

至

$(this).val();

或者，如果与客户段落中的内容不同（似乎确实是现在）：

$(this).closest(".addIndividual").find('.searched_name').text();

或如果该段落肯定位于按钮旁边：

$(this).prev().text();

Answer 2

看起来您已经在按钮的value属性中拥有客户的姓名。 您可以使用$(this).val()来获取它。

您还应该将按钮更改为使用class="addCustomer"而不是id="addCustomer" 。 ID用于唯一元素，而类用于多个元素。 对于您的情况，每个客户都有一个按钮。

Answer 3

代替$(".addCustomer").on( ...创建一个类似以下的函数：

function addCustomer(index){
   $('.addIndividual .searched_name_'+index).text();
   // continue the script ...
}

现在，您的while循环将如下所示：

<p style='float:left;'class='searched_name_".$customerid."'>".$customername."</p>