jQuery hotkeys plugin
Using this hotkeys plugin, https://github.com/jeresig/jquery.hotkeys, I'm having some problems with the following code:
jQuery( document ).ready( function( $ ) {
function insert_tag(tag){
$('#water_chemistry').val($('#water_chemistry').val()+' ['+tag+'] ');
}
$(document).bind('keydown', 'alt+ctrl+1', insert_tag("temp_min"));
$(document).bind('keydown', 'alt+ctrl+2', insert_tag("temp_max"));
$(document).bind('keydown', 'alt+ctrl+3', insert_tag("pH_min"));
$(document).bind('keydown', 'alt+ctrl+4', insert_tag("pH_max"));
$(document).bind('keydown', 'alt+ctrl+5', insert_tag("hardness_min"));
$(document).bind('keydown', 'alt+ctrl+6', insert_tag("hardness_max"));
$(document).bind('keydown', 'alt+ctrl+7', insert_tag("conductivity_min"));
$(document).bind('keydown', 'alt+ctrl+8', insert_tag("conductivity_max"));
$('a#temp_min').click(insert_tag("temp_min"));
$('a开发者_运维问答#temp_max').click(insert_tag("temp_max"));
$('a#pH_min').click(insert_tag("pH_min"));
$('a#pH_max').click(insert_tag("pH_max"));
$('a#hardness_min').click(insert_tag("hardness_min"));
$('a#hardness_max').click(insert_tag("hardness_max"));
$('a#conductivity_min').click(insert_tag("conductivity_min"));
$('a#conductivity_max').click(insert_tag("conductivity_max"));
});
If I refresh the page, all of the tags are inserted into the textarea.
I'm presuming I've messed my syntax up, but I'm not sure how!
Thanks in advance.
First off:
$('a#hardness_max').click(insert_tag("hardness_max"));
// is equivalent to:
var tmp = insert_tag("hardness_max");
$('a#hardness_max').click(tmp); // this calls the click handler with the result of the insert_tag function
What you probably wanted was:
$('a#hardness_max').click(function() { insert_tag("hardness_max"); });
// This function registers the click callback
As for the ctr+alt+1
, it is the same case, but I would also add the textbox so they can do the shortcut in the textbox:
$(document).add('#water_chemistry').bind('keydown', 'alt+ctrl+1', function() { insert_tag("temp_min"); });
So the final result is:
jQuery( document ).ready( function( $ ) {
function insert_tag(tag){
$('#water_chemistry').val($('#water_chemistry').val()+' ['+tag+'] ');
}
var docAndTextarea = $(document).add('#water_chemistry');
docAndTextarea.bind('keydown', 'alt+ctrl+1', function() { insert_tag("temp_min"); });
docAndTextarea.bind('keydown', 'alt+ctrl+2', function() { insert_tag("temp_max"); });
docAndTextarea.bind('keydown', 'alt+ctrl+3', function() { insert_tag("pH_min"); });
docAndTextarea.bind('keydown', 'alt+ctrl+4', function() { insert_tag("pH_max"); });
docAndTextarea.bind('keydown', 'alt+ctrl+5', function() { insert_tag("hardness_min"); });
docAndTextarea.bind('keydown', 'alt+ctrl+6', function() { insert_tag("hardness_max"); });
docAndTextarea.bind('keydown', 'alt+ctrl+7', function() { insert_tag("conductivity_min"); });
docAndTextarea.bind('keydown', 'alt+ctrl+8', function() { insert_tag("conductivity_max"); });
$('a#temp_min').click(function() { insert_tag("temp_min"); });
$('a#temp_max').click(function() { insert_tag("temp_max"); });
$('a#pH_min').click(function() { insert_tag("pH_min"); });
$('a#pH_max').click(function() { insert_tag("pH_max"); });
$('a#hardness_min').click(function() { insert_tag("hardness_min"); });
$('a#hardness_max').click(function() { insert_tag("hardness_max"); });
$('a#conductivity_min').click(function() { insert_tag("conductivity_min"); });
$('a#conductivity_max').click(function() { insert_tag("conductivity_max"); });
});
And here is the jsFiddle:
FIDDLE!
精彩评论