0

我有这个代码：

<form method="get" >
   <input type="text" name="keyword" id="map">
   <img src="style/keyboard.png" id="click"/>
   <button type="submit">Search</button> 
</form>

而这个 javascript 的东西，从这里采用，它的工作是在img点击时显示虚拟键盘：

$('‪#‎map‬').keyboard({
layout: 'custom',
customLayout: {
'default': [ 
    '\u0192(h):lower_case_function_(type_h) \n\
    \u0393(h):lower_case_gamma_(type_h) \n\
    \u0394(h):lower_case_delta_(type_h)\n\ 
',
'{shift} {accept} {cancel}'
],
'shift': [
    '\u03C6(h):lower_case_phi_(type_h) \n\
    \u03C7(h):lower_case_chi_(type_h) \n\
    \u03C8(h):lower_case_psi_(type_h) \n\ 
',
'{shift} {accept} {cancel}'
]
},
usePreview: false,
openOn:null
})
.addTyping();
$('‪#‎click‬').click(function() {
$('#map').getkeyboard().reveal();
});

他们工作正常。但，

问题是img第二次单击时，它不会隐藏虚拟键盘。我想要的是当img点击时，键盘出现。再次单击（两次）时，键盘消失。第三次单击时，键盘会重新出现。

我怎么做？我已经用谷歌搜索了这个问题，但仍然不知道该怎么做。谢谢..

已编辑： *使用@Arjun Vachhani 的答案解决*

$("#click").toggle(
    function()
    {
        $('#map').getkeyboard().reveal();
    },
    function() {
        $('#map').getkeyboard().close();
    });
4

2 回答 2

1

你可以使用 jquery 切换

$("#id").toggle(
     function () 
     {
          alert("action 1");
     },
     function () {
          alert("action 2");
     });

只需将代码粘贴到应该处理奇数点击事件的第一个函数中，然后将代码粘贴到处理偶数点击的第二个函数中即可

于 2013-08-13T11:47:43.920 回答
0

如果 HTML 在第一次点击后发生变化，这在第二次将不起作用：

$('‪#‎click‬').click(function() {...

尝试使用 jquery .on()，因为当元素在 DOM 中时点击有效。

在表单中添加一个 ID：

$("‪form#myform‬").on("click","img#‎click",function() {...

要不就：

 $("‪form").on("click","img#‎click",function() {...

jQuery .on()

第一次触发两者，但第二次只有 .on() 有效。

提琴手

于 2013-08-13T11:35:06.833 回答