Question

我在模板的根目录

中有自定义页面publish.php

    <?php
     /**
       **
       * Template Name: publish
       *
       * @package WordPress
       * @subpackage Twenty_Fourteen
       * @since Twenty Fourteen 1.0
       */
       ?>
     <link rel="stylesheet" type="text/css" href="../Asset/css/style.css">
     <script src="../Asset/scripts/script.js"></script>
    <?php
    get_header(); ?>
   <div class="col-md-12">
      <div style="background-color: #D3D3D3;height:1px;"></div>
      </div>
    <div id="primary" class="content-area">
    <main id="main" class="site-main  site-main--single" role="main">
    <div class="container-fluid">   

    <div class="col-md-5"></div>

    <div class="col-md-2">
    <div align="center" >
        <select id="typeselect" name="value" onChange="OnChangeSelect()">
            <option value="1">Featured</option><br />
            <option value="2">General</option><br />
        </select>
    </div> 
      </div><!-- type select-->

      <div class="col-md-12">
      <div style="background-color: #D3D3D3;height:1px;margin:5px"></div>
      </div>

    <div id="formbody" class="col-md-12">
      <!-- include php files here -->
    </div>

    <script>OnChangeSelect()</script>
    </div><!-- container -->
    </main> <!-- #main -->
    </div> <!-- #primary -->

<?php //get_sidebar(); ?>
<?php get_footer(); ?>

链接到以下javascript

  var val;
function OnChangeSelect()
 {
   var e=document.getElementById("typeselect");
   val = e.value;   
   if(val==2)
   {
       document.getElementById("formbody").innerHTML ="<?php get_template_part("+"publish_game_nr"+");?>";
   }
  else
    {
       document.getElementById("formbody").innerHTML ="<?php get_template_part("+"publish_game_fe"+");?>";
    }
 }

我想更改

中的内容

<div id="formbody" class="col-md-12">
   <!-- include php files here -->
</div>

在publish.php中，基于下拉菜单中选择的选项

所以我创建了两个单独的php文件publish_game_nr.php和publish_game_fe.php

我在javascript尝试使用innerhtml

更改div PHP以包含这些wordpress个文件

 get_template_part()

但未加载文件。当我直接在div标签中使用该功能时。然后成功加载文件

这样做的正确方法是什么？

Answer 1

试试这个：

document.getElementById("formbody").innerHTML ="<?php get_template_part('slug'); ?>";

Answer 2

这很容易

所以我将formbody div更改为

<div id="formbody" class="col-md-12">
  <div style="display:none" id="featured-div">
   <?php get_template_part("publish_game_fe") ?>
  </div>
  <div style="display:block" id="general-div">
   <?php get_template_part("publish_game_nr") ?>
  </div>
</div>

并使用以下javascript代码

function OnChangeSelect()
{
    var e=document.getElementById("typeselect");
    var val = e.value;  
          if(val==1){
         document.getElementById("general-div").style.display="block";
         document.getElementById("featured-div").style.display="none";
      }
      else{
         document.getElementById("general-div").style.display="none";
         document.getElementById("featured-div").style.display="block";
      }
}

如何在javascript中使用wordpress php函数？

2 个答案: