web-dev-qa-db-ja.com

JQueryが私のプラグインで動かない

WordPressプラグインでJQueryを使用するのは今回が初めてですが、いくつか問題があります。

これが私の "メイン"プラグインドキュメントです。

<?php

/*
    Plugin Name: Dump-It Scheduler
    Plugin URI: 
    Description:Description
    Version: 1.0
    Author: Blaine Anderson
    Author URI: http://www.blainevanderson.net
    License: 

*/

add_action( 'wp_enqueue_script', 'load_jquery' );
add_action('wp_register_script', 'register_script');
add_action('wp_enqueue_script', 'run_js_script');
add_action('admin_menu', 'add_master_schedule'); 
add_action('admin_menu', 'add_customer_search'); 
add_action('admin_menu', 'add_edit_trucks');
add_action('admin_menu', 'add_new_customer'); 

//Add master schedule link to Admin bar in WP
function add_master_schedule()
{
    add_menu_page('Master Schedule', 'Master Schedule', 'administrator', 'Master_Dump-it_Schedule', 'display_menu'); 
}

//Display the master schedule when link is clicked
function display_menu()
{
    include( plugin_dir_path( __FILE__ ) . '/Views/admin_main_display.php');
}

//Add customer search link to admin bar
function add_customer_search()
{
    add_menu_page('Customer Search', 'Customer Search', 'administrator', 'Customer_Search', 'display_customer_search');
}

//Display customer search page
function display_customer_search()
{
    include( plugin_dir_path( __FILE__ ) . '/Views/search_customer.php');
}

//Add edit trucks link to admin bar
function add_edit_trucks()
{
    add_menu_page('Edit Trucks', 'Edit Trucks', 'administrator', 'Display_Edit_Trucks', 'display_edit_trucks');
}

//Display edit trucks page when link is clicked.
function display_edit_trucks()
{
    include( plugin_dir_path( __FILE__ ) . '/Views/edit_trucks.php');
}

//Add 'add customer' link to admin bar
function add_new_customer()
{
    add_submenu_page('Customer_Search', 'Add Customer', 'Add Customer', 'administrator', 'Add_Customer', 'display_add_customer');
}

//Display add customer page when link is clicked.
function display_add_customer()
{
    include(plugin_dir_path(__FILE__) . '/Views/add_customer.php'); 
}

//Load jquery into plugin
function load_jquery() 
{
    wp_enqueue_script( 'jquery' );
}

function run_js_script()
{
    wp_enqueue_script('my_plugin_script'); 
}
function register_script()
{
    wp_register_script( 'my_plugin_script', plugins_url('/js/scheduler.js', __FILE__), array('jquery'), '1.0', false);
}
?>

ここに私のJavascriptがあります。単にアラート（scheduler.js）を表示します。

jQuery(document).ready(function($){
    alert("Hello World!");
});

なぜアラートが表示されないのでしょうか。私はHTMLファイルにwp_enqueue_scriptを追加しようとしました。

<?php
wp_enqueue_script( 'my_plugin_script' );
?>

<table width="100%" id="menubar">
    <tr>
        <td><a href="" onclick="display_customer_search();">Master Schedule</a> | <a href=truckroutes.php>Create Truck Routes</a> | <a href="search.php">Customer Search</a> | <a href="trucks.php">Edit Trucks</a> | <a href="customeredit.php?id=new">Add Customer</a> | <a href="/cms/login.php">CMS Login</a> | </td> 
    </tr>
</table>

私はWordPressにはとても不慣れですし、どんな方向性や助けもいただければ幸いです。あなたが他のコードを必要とするならば、私に知らせてください、しかしそれはそれのほとんどです。私が持っている他の唯一のコードは他のリンクに対するビューです。

pluginsjqueryjavascript
1
Blaine

無効なアクションを使用しています。

add_action('wp_enqueue_script', 'run_js_script');

正しい動作はwp_enqueue_scripts（単数形）ではなくwp_enqueue_script（複数形）です。代わりにこれを使ってください。

add_action('wp_enqueue_scripts', 'run_js_script');

編集する

ここで同じ問題：

add_action('wp_register_script', 'register_script');

単純にするためにwp_enqueue_scriptsにフックするだけです。

add_action('wp_enqueue_scripts', 'register_script');

実際には、2つのより良い選択肢があります。

  1. wp_register_script()呼び出しを、wp_enqueue_script()呼び出しと同じrun_js_scriptコールバックに入れます。
  2. wp_register_script()呼び出しを完全に排除し、wp_enqueue_script()の中で完全なパラメーターを使うだけです。
2
Chip Bennett