如何将 HTML 表单导入到单独的文件中



我一直在尝试导入一个html表单并将其嵌入到一个单独的html文件中,我的javascript尝试上传包含表单的文件

如下所示
<link rel="import" href="formhtml5.html" onload="handleLoad(event)" 
onerror="handleError(event)">
var link = document.querySelector('link[rel="import"]');
var el = link.import.querySelector('#flexyForm');
document.body.appendChild(link);

但是,当我尝试查看表单是否已上传时,我的页面只是空白的? 几天来一直在为此苦苦挣扎,它让我发疯,有人有任何猜测看看它是如何工作的吗?

如果这是你要找的,那么使用jQuery是可能的。

第一个文件.html

<html> 
<head> 
<script src="jquery.js"></script> 
<script> 
$(function(){
$("#includeForm").load("formFile.html"); 
});
</script> 
</head> 
<body> 
<div id="includeForm"></div>
</body> 
</html>

表单文件.html

<p>This is my Form</p>

注意:您的问题不清楚,您没有上传任何内容。相反,您只需将一些代码行从另一个 html 文件导入到您的文件中。如果是,上面的代码应该可以正常工作!

此外,如果包含的 HTML 文件附加了 CSS,则可能会弄乱您的页面样式。所以最好做内部CSS或根据firstFile的链接规则更改formFile中的CSS外部链接.html

除了JS之外,您还可以使用php来获取第二个文件的内容。

<?php file_get_contents="path to your file here" ?>

最新更新