javascript - 从输入中复制值并选择到 div 中

Question

我有一个带有输入[文本]、选择和文本区域的表单，如何克隆或复制数据/值 div 或 span 中的 input(type=text)、select、textarea，换句话说，在 HTML 中。

而且它必须在不刷新或重新加载页面的情况下发生。换句话说，如果我输入以下内容: <input type="text" name="f_name" value="Small john" />

我想在 a 中看到文本“Small john”

<span id="first_name">{here is the value of the field name}</span>

或者如果我从选择列表中选择一个选项，并且该选项的值为 id“499”且其内容为“USA”，那么我希望美国显示在跨度中，例如 id="Country_name".

我猜这一切都是用jquery/JS完成的。所以我做了这个FIDDLE ，对于那些想尝试的人!

Answer 1

试试这个

$("input[name=f_name]").on('keyup', function () {
    $('#first_name').html($(this).val());
});
$("select[name=country]").on('change', function () {
    $('#Country_name').html($(this).find('option:selected').text());
});

使用

• $(this).find('option:selected').text() 如果要选择文本
• $(this).find('option:selected').val() 如果要选择值

Updated Demo