我正在努力创建和测试我的第一个基本WP插件,但有些困难。我还运行一个WAMP服务器。
下面是使用的脚本。
html是通过WP的页面编辑窗口添加到页面的唯一脚本。php来自保存在Plugin/test\\u Plugin目录中的文件(其内容也可以通过WP中的插件编辑窗口查看)。javascript保存在与php文件相同的test\\u插件目录中的文件中。
旁注:
插件已在WP插件主窗口中“激活”。相同的(除了文件存储位置、名称、脚本名称等)之前已插入到主题的函数中。php文件以及可用的相关js文件已经演示了所需的功能。
我做错了什么??
html
<button id="unique_button" type="button">Click Me!</button>
--
test\\u插件。php
<?php
/*
Plugin Name: test_plugin
*/
function test_plugin() {
wp_enqueue_script( \'change_button\', get_template_directory_uri() . \'change_button.js\', array( \'jquery\' ), \'1.0.0\', 1 );
}
add_action( \'wp_enqueue_scripts\', \'test_plugin\' );
?>
--
change\\u按钮。js公司
jQuery( function ( $ ) {
$("#unique_button").click(function() {
$(this).fadeOut(1000);
})
});
最合适的回答,由SO网友:Dave Romsey 整理而成
将JavaScript或CSS从插件目录排队时,请使用plugin_dir_url( __FILE__ )
.
请注意plugin_dir_url()
返回带有尾部斜杠的URL,与get_template_directory_uri()
和get_stylesheet_directory_uri()
不返回带有尾部斜杠的URL。get_template_directory_uri()
和get_stylesheet_directory_uri()
分别在主题和子主题中更常用。
以下是的更新版本test_plugin()
. 它起作用了。
add_action( \'wp_enqueue_scripts\', \'test_plugin\' );
function test_plugin() {
wp_enqueue_script( \'change_button\', plugin_dir_url( __FILE__ ) . \'change_button.js\', array( \'jquery\' ), \'1.0.0\', 1 );
}
JavaScript还需要一个小补丁。
#unique_button
应在引号中。最后,这是使用的最佳实践
.on()
而不是
.click()
.
change_button.js:
jQuery( function ( $ ) {
$( "#unique_button" ).on( "click", function( e ) {
$(this).fadeOut(1000);
});
});