How can i attach to the click when a user presses "clear search input" in jQuery Mobile

As you can see on this page jQuery mobile renders an "X" at the right of the entered text in an input search box. How can开发者_高级运维 I attach to the click-event of that "X"?

---

$('.ui-input-clear').live('click', function(e){
    alert('click!');
});

Is a good starting point. I use live as the searchbox isn't necessarily in the page on load. This of course is nonspecific by using the class but if required can be made so.

Update: As of jQuery 1.7 .live is deprecated in favour of .on: http://api.jquery.com/on/

$('.ui-content').on('click', '.ui-input-clear', function(e){
    alert('click!');
});​

---

bind click to the whole thing and then determine what was clicked with event.target which holds the originally clicked element as the event bubbles up.

A simple if that checks for some classes should do.

Start from binding click and sniffing what's clicked:

$(theinput).click(function(e){
console.log(e.target);
});

---

Tested with jQuery 1.9 and jQuery Mobile 1.3:

I Have the input inside a form so, suscribed the event to an element inside it:

   <form id="frmBusqueda" action="frmBusqueda">                              
                            <input name="txtBusqueda" id="txtBusqueda" placeholder="Nombre de producto"
                                value="" type="search" data-clear-btn="false" onkeyup="activarFiltro();">
                </form>


    $('#frmBusqueda').on('click', '.ui-input-clear', function (e) {
                alert('click!');
    })