Question

我的表单包含输入[文本] ，选择和 textarea ，如何克隆或复制数据/值< / strong> of input（type = text），select，textarea in div或span，换句话说就是HTML。

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

我希望在
中看到文字“小约翰”
<span id="first_name">{here is the value of the field name}</span>

或者如果我从选择列表中选择一个选项，并且此选项的值为“499”且其内容为“USA”，那么我希望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

Answer 2

试试这个：

$('button').click(function(){
    $('#first_name').html($('input[name=f_name]').val());
    $('#Country_name').html($('select[name=country] option:selected').text());
});

演示here

此$('input[name=f_name]').val()获取输入值此.text()获取所选选项的文本此.val()获取所选选项的值。

Answer 3

塞尔吉奥走在正确的轨道上。不幸的是，他没有完全测试他的解决方案。这个有用......

http://jsfiddle.net/WLZyn/2

$('button').click(function(){
    $('#first_name').html($('input[name=f_name]').val());
    $('#Country_name').html($('select[name=country] option:selected').text());
});

所以，事实上（出于一些真正奇怪的原因），这......

$('select[name=country] option:selected').text()
获取所选选项的文本

$('select[name=country]').val()
获取所选选项的值

从Input复制值并选择div

3 个答案: