为什么我的关闭按钮不适用于触摸屏？

Question

我有一个关闭按钮，仅在单击图像时显示，图像将调整大小，单击关闭按钮后，它将调整为原始大小。适用于PC，但不适用于移动设备。这是代码：

$(document).ready(function () {
   $('.image').click(function (event) {
       /* code for hiding some elements and enlarging the image here */
       $('#close_button2').show();
   });
   $('#close_button2').on('touchend click', function(event){
       /* code for showing some elements and display the image in the smaller size again */
       $('#close_button2').hide();
   });
   $(document).keyup(function (e) {
            if (e.keyCode == 27) {
                /* some code for pressing escape button */
            }
   });
});

而不是$('#close_button2').on('touchend click', function(event){我也尝试过：

$('#close_button2').click(function (event) {
$('#close_button2').on( "vclick", function( event ) { //jQuery mobile only - there were some conflicts with my code
$('#close_button2').on(isMobile ? 'touchend' : 'click', function(event) {
$(document).on('click', '#close_button2', function(event) {

但没有任何效果。有什么想法吗？

Answer 1

on似乎不喜欢多个事件（让我感到惊讶！）。

改为使用bind：

JSFiddle：http://jsfiddle.net/TrueBlueAussie/TWDZY/

$(document).ready(function () {
   $('.image').click(function (event) {
       /* code for hiding some elements and enlarging the image here */
       $('#close_button2').show();
   });
   $('#close_button2').bind('touchend click', function(event){
       /* code for showing some elements and display the image in the smaller size again */
       $('#close_button2').hide();
   });
   $(document).keyup(function (e) {
            if (e.keyCode == 27) {
                /* some code for pressing escape button */
            }
   });
});