Question

这里有点奇怪

<form>
    <input type="text" id="test" value="abc" />
    <input type="submit" />
</form>

<script>
$('form').submit(function(ev){
   ev.preventDefault();
   alert($(this).html()); 
});
</script>

http://jsfiddle.net/F6XvW/

我更改输入字段的值，然后单击“提交”以获取HTML，但HTML中的值未更新？那是什么？如何获取更新的HTML？

Answer 1

用户输入的内容永远不会更改HTML。它是一个表单值，将作为参数发送到服务器。

见这里：your jsfiddle updated：

<form>
    <input type="text" id="test" placeholder="abc" />
    <input type="submit" />
</form>
<script>
$('form').submit(function(ev){
   ev.preventDefault();
   alert('inputted value = ' + $(this).find('input[type=text]').val()); 
});
</script>

如果您确实要更新DOM，则必须手动设置它：http://jsfiddle.net/F6XvW/3/

<强> JS

$('form').submit(function(ev){
   ev.preventDefault();
   $('#test').attr("value", $('#test').val());
   alert('changed input value to: ' + $(this).find('input[type=text]').val()); 
});

Answer 2

更改值的输入不会更改文档对象模型（DOM）。

<强>解

$('form').submit(function(ev) {
    ev.preventDefault();
    var newinputval = $(this).find('input[type=text]').val();
    var newhtml = $(this).html();
    newhtml = newhtml.replace("abc", newinputval);
    alert(newhtml);
});

如您所见，我首先收到新的输入值，然后我获取HTML并用当前输入值替换DOM的值。现在它完全符合您的要求。

JSFiddle demo

Answer 3

value 属性显示默认值，而非当前值（可在DOM属性中找到）同名。

如果要获取当前值，则必须遍历所有表单控件并从DOM中获取它们的值。

Answer 4

您正在读取初始HTML - 页面上的更改值在此HTML中不会更改。试试：

$('form').submit(function(ev){
   ev.preventDefault();
   alert($('#test').val()); 
});

...获取输入值。

Answer 5

如果您想获得任何输入的价值

$('form').submit(function(ev){
       ev.preventDefault();
       alert($("#test").val()); 
    });

$('input').val();

在表单中，您可以使用 .serialize（）;

表格HTML没有得到更新。

5 个答案: