时间戳

首页 > 解决方案 > 我正在尝试创建非常简单的 wordpress 插件，但我的 javascript 无法正常工作

javascript - 我正在尝试创建非常简单的 wordpress 插件，但我的 javascript 无法正常工作

问题描述

我已经连接了javascript文件

入队脚本函数是：

function wpplugin_admin_scripts(){
   wp_enqueue_script(
    'myplugin-admin',
    WPPLUGIN_URL.'admin/js/eylonplugin-admin.js',
    ['jquery'],
    time()
   );

 }
 add_action('admin_enqueue_scripts', 'wpplugin_admin_scripts', 100);

但是，当我尝试设置一些属性时，我做不到。

这是我添加HTML到插件页面的功能：

 function my_plugin_plugin_html(){ ?>
    
    <div id="wrap container">
        <h3> Plugin Header </h3>
    
        <form method="post" action='options.php'>
            <?php settings_errors(); ?>
            <?php settings_fields('my_plugin_option_group'); ?>
            <label for="my_plugin_field_plugin">Top bar color</label>
            <input name="my_plugin_field" id="my_plugin_field_plugin" type="text" value="<?php echo get_option('my_plugin_field')?>"><br>        
            <div>
            <?php submit_button('my_plugin I love you');?> 
        </form>
        <h2 id="js_checking">my_plugin<span class="selected_output"></span></h2>
        <script> </script>
        </div>
        <h3>My color is red</h3>
        <button id="try_me">Try me!</button>
    <?php
}

在这里，我试图设置我的 h3 属性的样式，但没有任何反应。但是警报正在起作用。

$("h3").css("color","red");
alert("Hello world");

标签： javascriptphpjquerywordpresswordpress-plugin-creation

解决方案

用如下方式包装你的 jquery 代码，这样你就可以在不使用 jQuery 而不是 $ 的情况下添加代码：

(function ($) {

YOUR CODES HERE

})(jQuery);

推荐阅读