Question

我知道这可能很简单，但是如何根据用户的输入更新文本？

例如，我有一个电子邮件模板，如下所示：

*问候，我的名字是 _ _ ，我是 _ __ 的作者，可在Amazon.com上找到。 *

我想创建一些简单的输入字段，供用户插入他们的名字和书名。还有几个输入。我只需要最终输出就可以根据他们提交的内容向他们提供模板的全文，并将他们自己的信息插入到正确的位置。

实现这一目标的最简单方法是什么？提前谢谢。

Answer 1

如果找不到更简单的方法可以使用jQuery：

$(document).ready(function() {
    $('.my-inputs').each(function() {
        $(this).on('keyup', function() {
            var name = $('#name').val() == '' ? '___' : $('#name').val();
            var book = $('#book').val() == '' ? '___' : $('#book').val();
            $('#result').html("*Greetings, My name is " + name + " and I'm the author of " + book + " which is available on Amazon.com.*");
        });
    });
});

http://jsfiddle.net/XEzBw/

Answer 2

似乎您正在搜索一种简单的格式方法，为此您必须使用任何插件。

否则：

<input type="text" id="inputName"></input>
<input type="text" id="inputAuthor"></input>

var name = $('#inputName').val();
var author = $('#inputAuthor').val();
var t = "*Greetings, My name is " + name + " I'm the author of " + author + " which is available on Amazon.com.";

您可以尝试DEMO here。

Answer 3

使用此功能。

$('button').click(function () {
                    var str = 'Greetings, My name is ' + $('#name').val() + 'and I\'m the author of ' + $('#book').val() + ' which is available on Amazon.com.';
                    $('#template').html(str);
                });

演示：http://jsfiddle.net/7bLJK/

如何根据用户输入更新文本？

3 个答案: