Question

我有一个响应点击事件的javascript函数

主要问题是我在plugin.php中调用了panel.js，没有任何反应。

BEFORE：

panel.js

$(document).ready(function(){
    $(".next_panel").click(function(){
        //Do something here
        return false;
    });
}

这是我变成插件之前的网页（main.html），注意我是如何加载JS的，这在我的实际开发中起作用。

<head>
    <script src="js/panel.js"></script>
</head>
<body>
    <a href="#" class="next_panel">
        <div class="block"></div>
    </a>
</body>

AFTER：

现在这可以作为普通网站使用，但是将其作为插件加载到wordpress中会给我带来一些问题，这里的主要问题是我似乎无法加载javacript。

panel.js

function panel(){
    $(".next_panel").click(function(){
        //Do something here
        return false;
    });
}

这是plugin.php中的代码，一旦我把它变成wordpress的插件，我就可以确认wp_head正在被调用。

wp_enqueue_script('panel', VS_PATH.'js/panel.js', array('jquery'));

//This will run our function when wp_head is called.
add_action('wp_head', 'vs_script');

function vs_get_panel()
{
    $panels = '
    <body>
        <a href="#" class="next_panel">
            <div class="block"></div>
        </a>
    </body>';
    return $panels;
}

function vs_insert_panel($atts, $content=null)
{
    $panel = vs_get_panel();
    return $panel;
}

add_shortcode('v_panel', 'vs_insert_panel');

function vs_script()
{
    print '<script type="text/javascript" charset="utf-8">
                jQuery(document).ready(function($)
                {
                        $(\'.panel\').panel();//This is where my problem is
                });
    </script>';
}

如果你看一下函数vs_script（）中的最后一段代码，这就是我建议在渲染后将javascript引入wordpress页面的方法。

该插件还有更多内容，例如图像和CSS，事情是，所有这些都有效，css工作正常，它只是我无法工作的JavaScript。

在Kats建议之后：

我仍然没有加载javascript，我的点击事件没有被采取行动。

plugin.php

function my_js()
{
    wp_enqueue_script('panel', VS_PATH.'js/panel.js', array('jquery'));
}

add_action('admin_enqueue_scripts', 'my_js');
add_action('login_enqueue_scripts', 'my_js');

//This will run our function when wp_head is called.
add_action('wp_head', 'vs_script');

function vs_get_panel()
{
    $panels = '
    <body>
        <a href="#" class="next_panel">
            <div class="block"></div>
        </a>
    </body>';
    return $panels;
}

function vs_insert_panel($atts, $content=null)
{
    $panel = vs_get_panel();
    return $panel;
}

add_shortcode('v_panel', 'vs_insert_panel');

function vs_script()
{
    print '<script type="text/javascript" charset="utf-8">
                jQuery(document).ready(function($)
                {
                        $(\'.panel\').panel();//This is where my problem is
                });
    </script>';
}

panel.js

function panel(){
    $(".next_panel").click(function(){
        //Do something here
        return false;
    });
}

Answer 1

此 wp_enqueue_script('panels', VS_PATH.'js/panels.js', array('jquery')); 不能单独工作。

通常这包含在一个函数中：

function my_js() {
    wp_enqueue_script('panels', VS_PATH.'js/panels.js', array('jquery'));
}

然后：

add_action('admin_enqueue_scripts', 'my_js');
add_action('login_enqueue_scripts', 'my_js');

无法将我的javascript加载到wordpress插件中

1 个答案: