0

我有这个页面,上面有三个人搜索。基本上它是一个文本框和按钮。当您单击按钮时,它会获取相关文本框中的文本,并应使用列表数据填充相关结果。

    <div class="personcontainer">
        <div class="peoplesearchdiv" >

        <input type="text" class="searchpersontxtbox" />
        <input type="button" value="Find" class="findpersonbtn" />
        <div class="peopleresultsdiv"></div>
    </div>
    <input type="hidden" class="personguid" />

<div class="personcontainer">
        <div class="peoplesearchdiv" >

        <input type="text" class="searchpersontxtbox" />
        <input type="button" value="Find" class="findpersonbtn" />
        <div class="peopleresultsdiv"></div>
    </div>
    <input type="hidden" class="personguid" />

<div class="personcontainer">
        <div class="peoplesearchdiv" >

        <input type="text" class="searchpersontxtbox" />
        <input type="button" value="Find" class="findpersonbtn" />
        <div class="peopleresultsdiv"></div>
    </div>
    <input type="hidden" class="personguid" />

好的,所以试图让它工作的 jquery 是:

$(document).ready(function () {

    $('.findpersonbtn').click(function () {

    var query = $(this).closest('.personcontainer').find('.searchpersontxtbox').val();

    $.get('/People/GetPeople/', { 'query': query }, function (data) {         

        $(this).closest('.peoplesearchdiv').find('.peopleresultsdiv').html(data);

    });

});

从 GetPeople 返回的是基本列表数据,例如。

<ul>
  <li>Cat</li>
  <li>Dog</li>
</ul>

所以我想要发生的是将html填充到同一个personscontainer中的peopleresultsdiv的列表数据。

虽然不起作用。

为了消除它是 GetPeople 方法,我将 jquery 更改为:

$(document).ready(function () {

        $('.findpersonbtn').click(function () {

        var query = $(this).closest('.personcontainer').find('.searchpersontxtbox').val();

        $.get('/People/GetPeople/', { 'query': query }, function (data) {         

            $(this).closest('.peoplesearchdiv').find('.peopleresultsdiv').html("<ul><li>Cat</li><li>Dog</li></ul>");

        });

    });

还是不行。

所以我尝试了:

$(document).ready(function () {
    $('.findpersonbtn').click(function () {

        var query = $(this).closest('.personcontainer').find('.searchpersontxtbox').val();

        $(this).closest('.peoplesearchdiv').find('.peopleresultsdiv').html("<ul><li>Cat</li><li>Dog</li></ul>");

        $.get('/People/GetPeople/', { 'query': query }, function (data) {


        });

    });

嗯嗯嗯。现在列表出现了。显然不是我想要的,因为我没有从该方法中填充。

所以看起来最近的发现在get中不起作用?

有谁知道为什么要修复?

4

1 回答 1

2

在 $.get 中拥有 $(this) 不会返回 peopleresultsdiv。

因此,您可以在 $.get 之外获取所需的 div 并将其放在变量中,然后在 $.get 中使用它

于 2012-07-04T03:35:46.817 回答