Question

我有一个带有选择选项的表格。选择更改后，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而不是select的结果。

Answer 1

实现它的JQuery函数（一旦您为select元素提供了mySelect的id：

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

JS Fiddle Demo

Answer 2

$(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>

Answer 3

    <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>

here是演示

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

3 个答案: