将文本更改为输入并返回文本

change text to input and back to text

本文关键字:文本 返回 输入      更新时间:2023-09-26

我有一个产品列表,价格是普通文本。当我点击价格时,我想用输入替换文本,当我调用 blur 事件时,它会更新数据库数据并用文本替换输入。

我有这个代码:

<td>
    <span onclick="make_field(this, 'text', '11', '12,350.00')">12,350.00</span> €
</td>
<script>
    function make_field(el, type, id, val) {
        var el = $(el);
        el.html('<input onblur="update_db_row(params); make_el(this, ''span'', ' + id + ', ''' + val + ''', ''' + **this.value** + ''')" type=' + type + ' name=' + id + ' value="' + val.replace(',',' ').replace(',',' ').replace('.',',') + '">'); // replace 12,350.00 to 12350,00
        el.attr('onclick', '');
    }
    function make_el(el, tag_name, id, old_value, **new_value**) {
        var el = $(el);
        alert(old_value);
        alert(new_value); // undefined, how I can give current input value to function when I click outside the input?
  }
</script>

谢谢。

我相信

这就是你想要的: jsFiddle 示例

您可以直接从输入元素获取新值,如下所示:

 function make_field(el, type, id, val) {
    var el = $(el);
    el.html('<input onblur="update_db_row(); make_el(this, ''span'', ' + id + ', ''' + val + ''')" type=' + type + ' name=' + id + ' value="' + val.replace(',', ' ').replace(',', ' ').replace('.', ',') + '">'); // replace 12,350.00 to 12350,00
    el.attr('onclick', '');

}

function make_el(el, tag_name, id, old_value) {
    var el = $(el);
    // Get the new value directly from the input.
    var new_value = el.val();
    // Set the new value on the span and remove the input box.
    el.parent().html(new_value);
    el.remove();
}
function update_db_row() {}