我制作一个自定义wordpress小部件,在前端我有一个按钮,将一个函数调用到一个脚本文件(js / gecofidelitycustom.js)。此函数位于单独的文件下,并使用Jquery。我的问题是如何从按钮这个函数调用。似乎没有看到函数,但我的脚本在加载时是正确的执行。提前致谢
这是我的代码:
`<?php
add_action('widgets_init', 'gecofidelity_register_widget');
function gecofidelity_register_widget() {
register_widget('GecoFidelity_Widget');
}
add_action('init', 'register_script');
function register_script() {
//wp_register_script('jquery', "//code.jquery.com/jquery-1.11.0.min.js");
wp_register_script('custom_jquery', plugins_url('js/gecofidelitycustom.js', __FILE__), array('jquery'));
//wp_register_style('new_style', plugins_url('css/bootstrap.min.css', __FILE__), false, '1.0.0', 'all');
}
add_action('wp_enqueue_scripts', 'gecofidwidget_required_scripts');
function gecofidwidget_required_scripts() {
// wp_enqueue_script('jsCustom', GECOFIDWIDGET_FOLDER_URL . 'js/jquery.js');
//wp_enqueue_script('jquery');
//wp_enqueue_script('jsCustom', GECOFIDWIDGET_FOLDER_URL . 'js/bootstrap.min.js');
//wp_enqueue_script('jqueryJS', GECOFIDWIDGET_FOLDER_URL . 'js/gecofidelitycustom.js', array('jquery'),'2.1.1');
//wp_enqueue_script('jquery');
wp_enqueue_script('custom_jquery');
//wp_enqueue_style('bootstrapStyle', GECOFIDWIDGET_FOLDER_URL . 'css/bootstrap.min.css');
}
class GecoFidelity_Widget extends WP_Widget {
public function __construct() {
parent::WP_Widget('GecoFidelity_Widget', 'GecoFidelity Widget', array('description' => 'Grazie a questo widget é possibile visualizzare una lista degli ultimi post e dei più commentati'));
}
public function form($instance) {
$defaults = array(
'title' => 'GecoFidelity',
'operative_mode_ID' => NULL,
'operative_mode_type' => NULL
);
$instance = wp_parse_args((array) $instance, $defaults);
$opmodetype = isset($instance['operative_mode_type']) ? $instance['operative_mode_type'] : 'company';
?>
<p>
<label for="<?php echo $this->get_field_id('title'); ?>">
<strong>Titolo:</strong>
</label>
<input class="widefat" type="text" id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" value="<?php echo $instance['title']; ?>" />
</p>
<p>
<label for="<?php echo $this->get_field_id('operative_mode_ID'); ?>">
<strong>Operative Mode ID:</strong>
</label>
<input class="widefat" type="text" id="<?php echo $this->get_field_id('operative_mode_ID'); ?>" name="<?php echo $this->get_field_name('operative_mode_ID'); ?>" value="<?php echo $instance['operative_mode_ID']; ?>" />
</p>
<p>
<label for="<?php echo $this->get_field_id('operative_mode_type'); ?>">
<strong>Operative Mode Type:</strong>
</label>
<!--input class="widefat" type="text" id="<?php //echo $this->get_field_id('operative_mode_type'); ?>" name="<?php //echo $this->get_field_name('operative_mode_type'); ?>" value="<?php //echo $instance['operative_mode_type']; ?>" /-->
<select id="<?php echo $this->get_field_id('operative_mode_type'); ?>" name="<?php echo $this->get_field_name('operative_mode_type'); ?>" value="<?php echo $instance['operative_mode_type']; ?>">
<option value="company" <?php echo $opmodetype == 'company' ? 'selected="selected"' : ''; ?>>company</option>
<option value="user" <?php echo $opmodetype == 'user' ? 'selected="selected"' : ''; ?>>user</option>
</select>
</p>
<?php
}
public function widget($args, $instance) {
extract($args);
$title = apply_filters('widget_title', $instance['title']);
echo $before_widget;
echo $before_title . $title . $after_title;
?>
<?php wp_enqueue_script('custom_jquery'); ?>
<div>
<p>
<label for="<?php echo $this->get_field_id('operative_mode_ID'); ?>">
<strong>N. Scheda:</strong>
</label>
<input class="" type="text" id="nscheda" />
<p id="msgPunti" class="hidden">Il tuo punteggio è di: </p>
</p>
<button id="btnControllaPunti" class="btn btn-default">Controlla</button>
</div>
<?php
echo $after_widget;
}
public function update($new_instance, $old_instance) {
$instance = $old_instance;
$instance['title'] = strip_tags($new_instance['title']);
$instance['operative_mode_ID'] = strip_tags($new_instance['operative_mode_ID']);
//$instance['operative_mode_type'] = strip_tags($new_instance['operative_mode_type']);
$instance['operative_mode_type'] = strip_tags($new_instance['operative_mode_type']);
return $instance;
}
}
?>
JS / gecofidelitycustom.js:
jQuery( document ).ready( function( $ ) {
// do_stuff();
console.log( "Eseguito Jquery 2!" ); //this is execute correctly at load of widget on frontend
jQuery("#btnControllaPunti").click(function(){
alert("ciao");
});
});