从表单元素查询实时预览

Question

我有一个表单，我希望在提交表单之前单击预览按钮后在页面的其他位置以图形方式表示。我写了以下内容：

         $('#preview').click(function() {
            var title = $('#inputTitle').attr('value');
            var location = $('#inputLocation').attr('value');

            $('.title').append(title);
            $('.location').append(location);                
        })

#inputTitle is a <input type="text"> from element
.title is an <h1> tag

这似乎有用，但APPEND是正确的用法吗？每次我点击预览它只是将值添加到现有，而我需要先以某种方式将其删除（每次点击前）或替换它。

感谢。

Answer 1

改为使用.text()或.html()。

另外请注意，使用类似.title的类作为您的选择器将替换页面上该类的每个实例的内容，这可能不是您想要的。请考虑使用ID选择器，保证只匹配一次（或从不）。