Question

我在jsfiddle http://jsfiddle.net/JGM85/279/制作了一个脚本，并希望在我的插件选项页面中使用它。我创建了css文件（css / style.css）和一个js文件（js / main.js）我引用它是这样的：

<script type="text/javascript" src="js/main.js"></script>
<link href="css/style.css" rel="stylesheet" />

但是，datepicker不起作用，也没有js和css。 Wordpress有一种特殊的方式来调用JS，Jquery和css文件吗？

更新了代码

function super_plugin_scripts(){
        wp_enqueue_script('jquery-ui-core');
    wp_enqueue_script('jquery-ui-datepicker');
}
add_action('wp_enqueue_scripts','super_plugin_scripts');
?>
<html>

<div class="demo">

<p>Date: <input type="text" id="datepicker" placeholder="Select a date"></p>

</div><!-- End demo -->


</html>

Answer 1

尝试使用以下代码：

//SETUP
function super_plugin_install(){
        //Do some installation work
}
register_activation_hook(__FILE__,'super_plugin_install');

添加脚本和样式（请在插件文件夹中添加css和js）

//SCRIPTS
function super_plugin_scripts(){
        wp_register_style( 'my-plugincss', plugin_dir_url( __FILE__ ).'css/style.css' ) );
        wp_enqueue_style( 'my-plugincss' );
        wp_register_script('super_plugin_scriptjs',plugin_dir_url( __FILE__ ).'js/main.js');
        wp_enqueue_script('super_plugin_scriptjs');
}
add_action('wp_enqueue_scripts','super_plugin_scripts');

在插件中添加datapicker的另一种方法:(不是CSS，对于css，你需要遵循上面的代码）

 wp_enqueue_script('jquery-ui-core');
 wp_enqueue_script('jquery-ui-datepicker');

WordFress插件选项页面中的JSFiddle

1 个答案: