Question

I am using jquery.autocomplete.js and jquery.apitags to select a few elements from a div (.ac_results) This works great, and I can select multiple elements etc. However the jquery-aptags plugin does only fire when enter is pressed. This might confuse some users if they use the mouse to click instead of the arrows/enter on the keyboard.

I think this is the code inside jquery.aptags that submits the tag.

//
// Hook to the keypress event.
//            
$(this).bind('keypress', {
    __c: __c
}, function (e) {

    var c = '';
    var i = 0;

    var v = $(this).val();

    if (e.keyCode == 13) {
        e.stopPropagation();
        e.preventDefault();
        __createSpans(this, v, e.data.__c, true);
    }

});

I am wondering if it is possible to call the method directly from a new event.

  $('.ac_results > ul > li').livequery(function() {
    $(this).bind('click', function() {
      $('#address_city'). //how do I fire the "enter" event from here?
    }); 
  });

Any thoughts?

Answer 1

Replace the snippet you provided with the below, and it should work as you want it to:

$(this).bind('keypress click', {
    __c: __c
}, function (e) {

    var c = '';
    var i = 0;

    var v = $(this).val();

    // if enter is pressed, or if element is clicked
    if (e.keyCode == 13 || e.type == 'click') {
        e.stopPropagation();
        e.preventDefault();
        __createSpans(this, v, e.data.__c, true);
    }

});

The only two changes I have made:

• Bind to the click event in addition to the keypress event.
• Enter the last condition if enter is pressed or the event type is ‘click’.