WordPress插件以及如何从js文件获取？

Question

I'm learning to building my own WordPress plugin and it nearly works.

Here's part of the code which I feel is the most relevant: (The plugin is supposed to create an splash screen on start where an Vimeo-clip is supposed to start playing automatically).

define( 'COLORBOX_VERSION', '1.4.24' );
define( 'BVSSP_VIMEO_VERSION', '1.0' );
define( 'BVSSP_CSS_VERSION', '1.0' );

add_action( 'wp_enqueue_scripts', 'bvssp_colorbox_js' );

add_action('wp_footer', 'bvssp_data_display');

function bvssp_colorbox_js() {
    wp_register_style( 'bvssp-style', plugins_url('/css/colorbox.css',__FILE__), array(), BVSSP_CSS_VERSION );
    wp_enqueue_style( 'bvssp-style' );
    wp_enqueue_script( 'jquery' );
    wp_register_script( 'bvssp-colorbox', plugins_url('/js/jquery.colorbox-min.js',__FILE__), array('jquery','jquery-ui-sortable'), COLORBOX_VERSION );
    wp_enqueue_script( 'bvssp-colorbox' );
    wp_register_script( 'bvssp-vimeo', plugins_url('/js/bvssp-vimeo.js',__FILE__), array('jquery','jquery-ui-sortable','bvssp-colorbox'), BVSSP_VIMEO_VERSION );
    wp_enqueue_script( 'bvssp-vimeo' );
}

function bvssp_data_display() {
    echo '<a style="display:none;" class="vimeo" href="http://player.vimeo.com/video/67189599?title=0&amp;byline=0&amp;portrait=0&amp;badge=0&amp;autoplay=1">vimeo</a>';
}

The problem I have is that the content found in the bvssp-vimeo.js is not executed. This is what's inside that file:

<script>
    jQuery(document).ready(function($) {
        $(".vimeo").colorbox({iframe:true, innerWidth:800, innerHeight:709, open: true});
    });
</script>

If I paste the code in this file directly in the theme, everything works great. But I want to execute the JS-code from the file instead. How can I do this?

Kind regards Johan (now very tired) :)

Answer 1

don't use HTML tags in javascript files :

jQuery(function($) {
    $(".vimeo").colorbox({iframe:true, innerWidth:800, innerHeight:709, open: true});
});