jquery - 从表单元素查询实时预览

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 选择器，它保证只匹配一次（或从不匹配）。