假设我有一个包含一些 html 元素的页面。
这些元素是 textboxes
、checkboxes
、radiobuttons
和其他用户响应的东西。
我需要将整个页面从客户端 1 传输到客户端 2 的可能性,这样客户端 2 就会看到客户端 1 设置到 html 元素中的所有内容。
我为此使用了 WebSocket 技术,但我不知道如何传输这些元素。如果我传输 document.body.innerHTML
然后 client2 看到空白元素,而不是填充元素。
页面上可以有任意数量的任意 html 元素。是否可以通过 websocket 执行类似克隆元素的操作?就像我序列化整个 document.body
并将其传输到另一个客户端?
页面是简单的html页面。没有使用任何服务器端脚本。我使用在同一端口上工作的自制 http + websocket 服务器。
最佳答案
我开始了一些可以帮助你的事情。
- 你创建一个循环以通过标签获取元素(以获取所有输入)
- 您根据类型处理它们:
text
、checkbox
、radio
...通过将值保存在属性中(在我的例子,我使用值更新了默认值) - 然后按您希望的方式发送。在我的示例中,我使用
alert
显示内容;但请使用您的 socket 。
也许你需要在接收页面添加一些处理。
文本输入将显示默认值,但您可能必须从“值”属性中设置复选框“选中”。我会使用一个 document.onload
,每个都有一个 (通过标签获取元素)
例子如下: Javascript get Body content into variable
<body>
<p class="first">Hello World Dude</p>
<label for="search_field">my text:</label>
<input type='text' id ='myinput' class='MyIntputField' />
<input type="checkbox" name="vehicle" value="Bike"> I have a bike<br>
<input type="checkbox" name="vehicle" value="Car" checked> I have a car<br>
</body>
<p id="demo" onclick='myFunction()'>Click me to send Data.</p>
<script>
function myFunction() {
inputs = document.getElementsByTagName('input');
for (index = 0; index < inputs.length; ++index) {
switch (inputs[index].type){
case "text":
inputs[index].defaultValue = inputs[index].value;
break;
case "checkbox":
inputs[index].value = inputs[index].checked;
break;
}
}
var $mybody = $("body").html();
}
</script>
关于javascript - 无论如何,是否可以将 html 元素从一个客户端传输到另一个客户端,同时保留每个输入的值,例如在文本框中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31002991/