如何选择我的活动元素所在的 td

How to select the td where my active element is in

本文关键字：元素 td 活动 我的 何选择 选择      更新时间：2023-09-26

我有一个带有选择选项的表格。选择更改后，td 的 innerHTML 应更改为所选值，以便选择消失。

<table>
  <tr>
    <td>
      <select onchange="update(param1, param2)">
        <option value="Value 1">Value 1</option>
        <option value="Value 1">Value 2</option>
      </select>
    </td>
  </tr>
</table>

因此，当我选择值 2 时，表格应如下所示：

<table>
  <tr>
    <td>
      Value 2
    </td>
  </tr>
</table>

我该怎么做。我已经尝试过像parentNode，parent（）这样的东西。它必须是javascript或jQuery。

function update(id, row) {
    var val = document.activeElement.value;
    var id  = id;
    var row = row;
    if (val != '') {
        $.post('../inc/helikopter_beheer.php', {val: val, id: id, row: row}, function(data) {});
        $.post('../inc/gereedstelling_get_info.php', {id: id, rij: row}, function(data) {
            var result = data.split(",");
            // this.parents('id').innerHTML = result;
            $(this).closest("td").html(result[0]);
            alert(result[0]);
        });         
    };
}

这就是我得到的。它从我的数据库中获取一些数据，将其转换为结果，我必须在我的 td 而不是选择中获取结果。

完成

它的JQuery函数（一旦你给你的select元素一个ID mySelect）：

$('#mySelect').on('change', function () {
    var val = $(this).val();
    $(this).parent().html(val);
});

JS小提琴演示

    <table>
      <tr>
        <td>
          <select id="wdm_select">
            <option value="Value 1">Value 1</option>
            <option value="Value 2">Value 2</option>
            <option value="Value 3">Value 3</option>
          </select>
        </td>
      </tr>
    </table>
<script>
$(document).ready(function() {
    $("#wdm_select").on("change",function() {
        var selected_val = $(this).val();
        $(this).parent().html( selected_val );
    })
})
</script>

这是演示

$(document).on('change','#foo',function(){     
  $(this).parent('td').html($(this).val());
  $(this).remove();  
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>
      <select id="foo">
        <option value="">--Select--</option>
        <option value="Value 1">Value 1</option>
        <option value="Value 2">Value 2</option>
      </select>
    </td>
  </tr>
</table>

相关文章：