从WordPress页面/帖子添加自定义Java脚本中的输入

时间:2017-02-25 作者:baswijdenesdotcom

我在WordPress博客的每个页面上都有一个脚本,但每次都有不同的输入。

例如,我有一个提示按钮:每个页面上的提示按钮需要不同。

function answerbutton() {
    document.getElementById("answer").innerHTML = \'Readers will see this text as a hint\';
}
我现在要做的是将脚本复制到一个位置并更改值。并从其他位置加载脚本。

https://domainname/page2/hint1

我想做的是让脚本在页面编辑器页面上获取某种文本框。我可以在所有页面上使用不同的输入,但它加载相同的文本。

我有这样的想法:

<textarea =id"textarea">
function answerbutton() {
    document.getElementById("answer").innerHTML = \'ID="textarea"\';
}
但我不能让它工作。。我的javascript技能为零。有人能帮我找到正确的路吗?或者给我“提示”<例如,是否有WordPress插件可以做到这一点?

这就是我添加到循环中的内容?我猜是索引。php:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<h1><?php the_title(); ?></h1>
<p><?php the_content(__(\'(more...)\')); 
$hint1_of_this_page = get_post_meta( get_the_ID(), \'hint1\', true );
$hint2_of_this_page = get_post_meta( get_the_ID(), \'hint2\', true );
$hint3_of_this_page = get_post_meta( get_the_ID(), \'hint3\', true );
$hint4_of_this_page = get_post_meta( get_the_ID(), \'hint4\', true );
$answerbutton_of_this_page = get_post_meta( get_the_ID(), \'answerbutton\', true );
$correctanswervalidate = get_post_meta( get_the_ID(), \'correctanswervalidate\', true );
?></p>
<hr> <?php endwhile; else: ?>
这是我添加到页脚的内容。php:

 <script type="text/javascript">
function answerbutton() {
    document.getElementById("answer").innerHTML = \'<?php echo $answerbutton_of_this_page; ?>\';
}
</script>
<script type="text/javascript">
function hintbutton() {
    document.getElementById("hint1").innerHTML = \'<?php echo $hint1_of_this_page; ?>\';
}
</script>
<script type="text/javascript">
function hintbutton2() {
    document.getElementById("hint2").innerHTML = \'<?php echo $hint2_of_this_page; ?>\';
}
</script>
这是我使用自定义字段的方式:enter image description here

2 个回复
最合适的回答,由SO网友:David Lee 整理而成

你需要的是custom field 或ameta box, 您可以搜索有大量教程来创建custom field 更简单的一个,你可以读到here, 首先,您必须查看自定义字段,为此,您需要打开屏幕选项并选中自定义字段复选框,这在页面/后期编辑屏幕中:

enter image description here

然后,您可以开始创建自定义字段,可以为postspages, 在这里你可以看到我创建了一个名为\'hint\':

enter image description here

然后您可以使用检索它,如下所示(在循环中):

<?php
// Start the loop.
while (have_posts()) : the_post();
    the_content();

    //here we retrieve the value and save it in a var to use it later
    $hint_of_this_page = get_post_meta( get_the_ID(), \'hint\', true );


 // End the loop.
 endwhile;
 ?>
然后在前端代码中这样使用它(我想是在页脚中):

<?php global $hint_of_this_page; ?>
function answerbutton() {
    document.getElementById("answer").innerHTML = \'<?php echo $hint_of_this_page; ?>\';
}
它将显示如下:

enter image description here

SO网友:Richard Webster

在本例中,它获取隐藏输入字段的“值”,并打开一个警报框。在现实世界中,您可以随意使用变量mytext。

你可以把文档放在下面,而不是像我下面那样使用标签。在站点javascript文件中的ready()函数。

<div class="container">

<input type="hidden" id="someid" value="Your text here">
<button class="somebutton">Click me!</button>

<script>
(function($) {
    $(document).ready(function(){

        $( \'.somebutton\' ).click( function(e) {
            var mytext = $( \'#someid\' ).val();
            alert(mytext);

        });

    });
})( jQuery );
</script>

</div>