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('');
    });
});

这是我在php中附带的html。这包含了上面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>

使用jQuery从当前div

3 个答案: