2012-07-24 53 views
-2

我有一个表单的网站。例如,我向用户展示的数据填充表格:如何通过JS获取网站的实际HTML代码?

<input type='text' value="" name="dsa" /> 

而且他用“3”的值填充它;

然后他点击按钮“保存”。现在我想拥有包含字段值的网站的整个HTML。所以我用:

document.documentElement.innerHTML

,但我得到:

<input type='text' value="" name="dsa" /> 

但我要得到这样的:

<input type='text' value="3" name="dsa" /> 

注意我要采取全HTML的网站,不仅一个领域。我不知道网站上会有什么字段,所以我需要一个通用的解决方案。

+1

你能解释一下你正在努力完成什么吗? – asawyer 2012-07-24 13:48:24

+0

[读取带有VALUE属性(及其值)的INPUT标记的HTML表单的innerHTML]的可能的重复](http://stackoverflow.com/questions/7601851/reading-innerhtml-of-html-form-with-value-attribute -its-value-of-input-tags) – epascarello 2012-07-24 13:49:33

+0

@asawyer呃..我不知道你想让我解释一下。请解释一下在这个问题中不可理解的东西。 – 2012-07-24 13:52:44

回答

2

AFAIK您无法从HTML代码中获取此代码,因为当用户在输入文本字段中输入内容时HTML代码不会更改。

你可以做的是让页面上的所有输入字段和像这样的东西让他们的价值观:

var inputs, index; 

inputs = document.getElementsByTagName('input'); 
for (index = 0; index < inputs.length; ++index) { 
    // deal with inputs[index] element. 
} 

的代码是从这个帖子:https://stackoverflow.com/a/2214077/312312 我是懒得写下来我自:P

+0

我不想获取字段的值。正如我写的,我想抓住整个HTML与这个值的地方。有任何想法吗? – 2012-07-24 13:51:48

+0

你为什么要这么做?你不能,如果你填写字段,HTML不会改变。 – Onheiron 2012-07-24 13:53:05

+2

如果页面只有输入文本字段,请按照原样(不包含输入的值)抓取HTML,使用我提供的代码抓取值,并在抓取的HTML代码中将value =“”替换为value =“X”,其中X是你从上面的代码得到的值 – Lefteris 2012-07-24 13:53:17

1

在jQuery中我做

$(function() { 
    $('input').keyup(function() { 
     $(this).attr('value', $(this).val()); 
    }); 

});​ 

因为值属性没有钥匙后成立

+2

我正要发布这个。这里是一个jsfiddle:http://jsfiddle.net/cpbX6/我用.change()代替.keyup() – 2012-07-24 13:54:09

+0

我不使用jQuery库。 – 2012-07-24 13:54:23

+1

@tomaszs开始这样做。有人注意到你想用javascript处理jQuery不能做的事情。 – 2012-07-24 13:58:29

-1

您可以尝试在整个文档上设置一个实时事件,该事件将设置属性为HTML,并且用户设置值或在提交时设置它们。

例如

$("body").on("change", "select,input,textarea", function(){ 
    $(this).attr("value", $(this).val()); 
}); 

第一种方式,但本不应该如此盲目做,你会得到与复位问题。你应该解决与选定的电台,复选框和其他属性的问题,不仅值。

第二种方法是在真正需要时序列化整个页面。

var serialize = function(el){ 
    $("select, input, textarea").each(function(){ 
    $(this).attr("value", $(this).val()); //the same way as upper 
    }); 
} 
$(".serialize").click(function(){ 
    var inner = $("body"), 
     html; 
    serialize(inner); 
    html = inner.html(); //here you will get whole html with setted attributes 
}); 

这种方式似乎更好,因为那里不会是不必要的事件的委派。

http://jsfiddle.net/CeAXL/2/ - 测试示例。

但是在两种方式中,将永久值设置为DOM本身并不是一个好主意。

+0

不错,但我需要一个JavaScript解决方案。不使用JQUERY库。 – 2012-07-24 14:15:14

相关问题