Javascript 在wordpress中动态添加和删除html表中的行

我是WordPress的乞丐。我已经使用javasrcipt创建了一个html页面来添加/删除html表中的行。这个html页面正常工作。 但当我在WordPress中复制它时，它从未响应。它不允许我添加\删除行

请帮我输入WordPress代码

代码如下：

时间表表格
函数addRow（tableID）{
var table=document.getElementById（tableID）；
var rowCount=table.rows.length；
var row=table.insertRow（rowCount）；
//第1栏
var cell1=行插入单元格（0）；
var element1=document.createElement（“输入”）；
element1.type=“按钮”；
var btnName=“按钮”+（行计数+1）；
element1.name=btnName；
element1.setAttribute（'value'，'Delete'）；//或element1.value=“button”；
element1.onclick=function（）{removeRow（btnName）；}
单元格1.附加子元素（元素1）；
//第2栏
var cell2=行插入单元格（1）；
cell2.innerhtml=rowCount+1；
//第3栏
var cell3=行插入单元格（2）；
cell3.innerhtml=“分支”；
//第4栏
var cell4=行插入单元格（3）；
var element4=document.createElement（“输入”）；
element4.type=“text”；
第四单元附属物（第四单元）；
//第5栏
var cell5=行插入单元格（4）；
cell5.innerhtml=“Sem”；
//第6栏
var cell6=行插入单元格（5）；
var element6=document.createElement（“输入”）；
element6.type=“text”；
第六单元附属物（第六单元）；
//第7栏
var cell7=行插入单元格（6）；
cell7.innerhtml=“主题”；
//第8栏
var cell8=行插入单元格（7）；
var element8=document.createElement（“输入”）；
element8.type=“text”；
第8单元附属物（第8单元）；
//第9栏
var cell9=行插入单元格（8）；
cell9.innerhtml=“时间从”；
//第10栏
var cell10=行插入单元格（9）；
var element10=document.createElement（“输入”）；
element10.type=“text”；
第10单元。附加子元素（元素10）；
//第11栏
var cell11=行插入单元格（10）；
cell11.innerhtml=“时间到”；
//第12栏
var cell12=行插入单元格（11）；
var element12=document.createElement（“输入”）；
element12.type=“text”；
第12单元。附加子元素（元素12）；
}
函数删除程序（btnName）{
试一试{
var table=document.getElementById（'dataTable'）；
var rowCount=table.rows.length；
对于（变量i=0；i

我不会做整件事（所以这不是一个免费为你做的地方），但我可以让你开始

在主题中创建

page tables.php

，然后添加

<?php
/*
Template Name: Tables
*/

get_header();

$meta      = get_post_meta();
$name      = ( isset( $meta['nameTxt'][0] ) && '' !== $meta['nameTxt'][0] ) ? $meta['nameTxt'][0] : '';
$branch    = ( isset( $meta['branchTxt'][0] ) && '' !== $meta['branchTxt'][0] ) ? $meta['branchTxt'][0] : '';
$sem       = ( isset( $meta['semTxt'][0] ) && '' !== $meta['semTxt'][0] ) ? $meta['semTxt'][0] : '';
$subject   = ( isset( $meta['subTxt'][0] ) && '' !== $meta['subTxt'][0] ) ? $meta['subTxt'][0] : '';
$time_from = ( isset( $meta['timeFromTxt'][0] ) && '' !== $meta['timeFromTxt'][0] ) ? $meta['timeFromTxt'][0] : '';
$time_to   = ( isset( $meta['timeToTxt'][0] ) && '' !== $meta['timeToTxt'][0] ) ? $meta['timeToTxt'][0] : '';
?>

<table  width="350px" border="1">
    <tr>
        <td>
            <?php esc_html_e( 'Your Name', 'your_theme_slug' ); ?>
        </td>
        <td>
            <input type="text" value="<?php echo esc_attr( $name ); ?>" name="nameTxt">
        </td>
    </tr>
</table>
<input type="button" class="add_row_button" value="<?php esc_attr_e( 'Add Row', 'your_theme_slug' ); ?>"/>
<table id="dataTable" width="350px" border="1">
    <tr>
        <td>
            <input type="button" class="delete_row_button" value="<?php esc_attr_e( 'Delete', 'your_theme_slug' ); ?>">
        </td>
        <td class="row_no">1</td>
        <td>
            <?php esc_html_e( 'Branch', 'your_theme_slug' ); ?>
        </td>
        <td>
            <input type="text" value="<?php echo esc_attr( $branch ); ?>" name="branchTxt">
        </td>
        <td><?php esc_html_e( 'Sem', 'your_theme_slug' ); ?></td>
        <td>
            <input type="text" value="<?php echo esc_attr( $sem ); ?>" name="semTxt">
        </td>
        <td><?php esc_html_e( 'Subject', 'your_theme_slug' ); ?></td>
        <td>
            <input type="text" value="<?php echo esc_attr( $subject ); ?>" name="subTxt">
        </td>
        <td><?php esc_html_e( 'Time From', 'your_theme_slug' ); ?></td>
        <td>
            <input type="text" value="<?php echo esc_attr( $time_from ); ?>" name="timeFromTxt">
        </td>
        <td><?php esc_html_e( 'Time To', 'your_theme_slug' ); ?></td>
        <td>
            <input type="text" value="<?php echo esc_attr( $time_to ); ?>" name="timeToTxt">
        </td>
    </tr>
</table>

<?php get_footer();

你不能只是在WordPress中粘贴HTML然后期望它工作。您需要使用php，保存到数据库，然后从那里得到结果。在post或页面中粘贴html和javascript将不起作用，因为内容会保存在数据库中，并且默认情况下会对内容进行清理，这可能会破坏代码。创建一个输出表的页面模板，然后可以使用该模板，或者创建一个短代码。有很多方法可以做到这一点。@dingo\d请告诉我如何在wordpress中编写添加动态行的代码。