Jquery 如何在选定行的 td 内 select ul

Question

如何在所选行的<td>内 select <ul> 。 这是我的 html 和 jquery 代码。 帮我解决这个问题。

我正在尝试在<td>中插入 select <ul>标记以插入通过 ajax 获取的数据。

这是 jquery 代码。

 $('.result').click(function () {
            var tpid = $(this).parents('tr').find('.tpId').val();
            $.ajax({
                    type: "POST",
                    url: "/Reception/PatientTests/getHelpValue",
                    data: { 'tpid': tpid },
                success: function (data) {
                    str = "";
                    for (var i = 0; i < data.length; i++) {
                        str +="<li>"+data[i] + "</li>";
                    }
                    $(this).find('td ul').html(str);
                },
                    error: function (e) {
                        alert('Error' + JSON.stringify(e));
                    }
            });

        });

这是我的 html 代码。

<table class="table table-bordered table-sm" style="height:auto">
                                    <tbody><tr class="blue-gradient-rgba text-white">
                                        <th>Test Name</th>
                                        <th>Value</th>
                                        <th>Unit</th>
                                        <th>Normal</th>
                                        <th>Minimum</th>
                                        <th>Maximum</th>
                                    </tr>

                                        <tr>
                                                <input type="hidden" class="tid" value="2">
                                                <th colspan="2">COMPLETE BLOOD COUNT</th>
                                        </tr>
                                                <tr>
                                                    <td>Haemoglobin</td>
                                                    <td>
                                                        <input type="hidden" class="tpId" value="9">
                                                    <input type="text" class="result" value="45">
                                                    <ul class="helpValues"></ul>
                                                    </td>
                                                    <td>gm %</td>
                                                    <td>m-14.0 to 18.0 Gms. %
F- 12.5 to 16.0 Gms. %</td>
                                                    <td></td>
                                                    <td></td>
                                                </tr>
                                                <tr>
                                                    <td>MCV</td>
                                                    <td>
                                                        <input type="hidden" class="tpId" value="12">
                                                    <input type="text" class="result" value="75">
                                                    <ul class="helpValues"></ul>
                                                    </td>
                                                    <td>fl</td>
                                                    <td>76- 96</td>
                                                    <td></td>
                                                    <td></td>
                                                </tr>
                                        <tr>
                                                <input type="hidden" class="tid" value="3">
                                                <th colspan="2">DENGUE IgG /IgM</th>
                                        </tr>
                                                <tr>
                                                    <td>Dengue IgG</td>
                                                    <td>
                                                        <input type="hidden" class="tpId" value="13">
                                                    <input type="text" class="result" value="53">
                                                    <ul class="helpValues"></ul>
                                                    </td>
                                                    <td>ml</td>
                                                    <td></td>
                                                    <td>1 mL serum</td>
                                                    <td></td>
                                                </tr>
                                                <tr>
                                                    <td>Dengue IgM</td>
                                                    <td>
                                                        <input type="hidden" class="tpId" value="14">
                                                    <input type="text" class="result">
                                                    <ul class="helpValues"></ul>
                                                    </td>
                                                    <td>ml</td>
                                                    <td></td>
                                                    <td></td>
                                                    <td></td>
                                                </tr>
                                                <tr>
                                                    <td>Dengue NS1</td>
                                                    <td>
                                                        <input type="hidden" class="tpId" value="15">
                                                    <input type="text" class="result">
                                                    <ul class="helpValues"></ul>
                                                    </td>
                                                    <td>ml</td>
                                                    <td></td>
                                                    <td></td>
                                                    <td></td>
                                                </tr>

                                </tbody></table>

我试过这个$(this).find('td ul').html(str); 但它不起作用。 在这里，我想将数据添加到特定行的 ul 中。

Answer 1

.tpId就在前面，而ul就在.result旁边。 因此，您可以使用prev和next ：

var tpid = $(this).parents('tr').find('.tpId').val();
// Alternative:
var tpid = $(this).prev().val(); // I love this approach

// This is wrong
$(this).find('td ul').html(str);
// You're finding from `.result`
// So, use:
$(this).parents('tr').find('ul').html(str);
// But, you can do just
$(this).next().html(str); // I love this approach

Answer 2

据我了解，您尝试在“td”内部访问“ul”。 这是在 td 中包含 ul 的代码块。

 <tr>
      <td>MCV</td>
      <td>
          <input type="hidden" class="tpId" value="12">
          <input type="text" class="result" value="75">
          <ul class="helpValues"></ul>
       </td>
       <td>fl</td>
       <td>76- 96</td>
       <td></td>
       <td></td>
       </tr>

Jquery代码

$(".result").on("click",function()
{

let ul=$(this).parent().find("ul");
let ulValues=$(ul).val();

console.log(ulValues);


})