Question

我有这段代码，我正在尝试用JavaScript编写代码，以便document.getElementById().innerHTML可以设置为该代码，然后以html格式显示。
我不能用我的生活用JavaScript编写这段代码，这里的任何人都可以吗？

<form action='create_new_invoice.php?name="<?php echo $row['Email']; ?>"' method="post" style="border: 0; padding: 0;">
<input type="hidden" name="Date" value="<?php echo $row["Date"]; ?>" />
<input type="hidden" name="StartTime" value="<?php echo $row["StartTime"]; ?>" />
<input type="hidden" name="FinishTime" value="<?php echo $row["FinishTime"]; ?>" />
<input type="hidden" name="Email" value="<?php echo $row['Email']; ?>"></input>
<input type="hidden" name="Forename" value="<?php echo $row['Forename']; ?>"></input>
<input type="hidden" name="Surname" value="<?php echo $row['Surname']; ?>"></input>
<input type="submit" class='NewInvoice hidden-xs' style="border: 0; padding: 0;" value="New Invoice"></input>

Answer 1

您可以在javascript中创建一个字符串：

String lines[] = loadStrings("list.txt");
println("there are " + lines.length + " lines");
for (int i = 0 ; i < lines.length; i++) {
  println(lines[i]);
}

然后添加一些元素u var htmlForm = '<form action="create_new_invoice.php?name='+ javascriptObject['Email']; +'" method="post" style="border: 0; padding: 0;">\ <input type="hidden" name="Date" value="'+ javascriptObject["Date"]; +'" />\ <input type="hidden" name="StartTime" value="'+ javascriptObject["StartTime"]; +'" />\ <input type="hidden" name="FinishTime" value="'+ javascriptObject["FinishTime"]; +'" />\ <input type="hidden" name="Email" value="'+ javascriptObject['Email']; +'"></input>\ <input type="hidden" name="Forename" value="'+ javascriptObject['Forename']; +'"></input>\ <input type="hidden" name="Surname" value="'+ javascriptObject['Surname']; +'"></input>\ <input type="submit" class="NewInvoice hidden-xs" style="border: 0; padding: 0;" value="New Invoice"></input>';：

innerHTML

您可以存储在javascript对象中的动态数据：

document.getElementById('someId').innerHTML(htmlForm);

Answer 2

将HTML与Javascript代码分开可能是个好主意。 PHP在服务器上运行，它被渲染为text / html并发送到浏览器，在那里它被解析为一个对象。通过分离代码，您可以重用事物而无需重写所有内容。首先定义HTML：

<form id="myform" action="#" method="post" style="border: 0; padding: 0;">
    <input type="hidden" name="Date" value="" />
    <input type="hidden" name="StartTime" value="" />
    <input type="hidden" name="FinishTime" value="" />
    <input type="hidden" name="Email" value="" />
    <input type="hidden" name="Forename" value="" />
    <input type="hidden" name="Surname" value="" />
    <input type="submit" class='NewInvoice hidden-xs' style="border: 0; padding: 0;" value="New Invoice" />
</form>

然后在底部，或使用window.onload甚至处理程序，有这样的东西：

<script type="text/javascript">
var myform = document.getElementById( 'myform' ); 
myform.setAttribute( "action", "/create_new_invoice.php?name=[VALUE]" ); 
myform["Date"].value = "[VALUE]";
myform["StartTime"].value = "[VALUE]";
myform["FinishTime"].value = "[VALUE]";
myform["Email"].value = "[VALUE]";
myform["Forename"].value = "[VALUE]";
myform["Surname"].value = "[VALUE]";
</script>

这将填写表单，并且可以转换为一个函数，您可以在以后需要重用它来更新表单的值，而不会弄乱HTML。

如何用JavaScript编写这个HTML / PHP代码

2 个答案: