将事件“点击”到jquery.mobile中存在问题。当对项目进行“轻击”时,该项目被隐藏,它触发位于该项目下方的INPUT字段上的事件“焦点”。 我该如何让焦点事件不会被解雇? 这是一个小例子代码。jquery.mobile“点击”发射“焦点”事件
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<style>
.drop {
position: fixed;
left: 0;
top: 0;
width: 100%;
z-index: 100;
padding: 0 0 1px;
}
.drop .holder {
overflow: hidden;
padding: 10px 10px 3px;
margin: 0 24px -2px;
background: #1c365b;
}
a {font-size: 24px;}
</style>
</head>
<body>
<form action="#" id="form">
<input type="text" name="input 1">
<input type="text" name="input 2">
<input type="text" name="input 3">
</form>
<div class="drop">
<div class="holder">
<a>Link 1</a><br>
<a>Link 2</a><br>
<a>Link 3</a><br>
</div>
</div>
<div id="console"></div>
<script>
$(function() {
var console = $('#console');
$('.drop').find('a').unbind('tap').bind('tap', function (e) {
console.append(' tap on drop menu');
$('.drop').hide();
return false;
});
$('#form').find('input').unbind('focus').bind('focus', function (e) {
console.append(' focus on ' + $(e.target).attr('name'));
});
});
</script>
</body>
隐藏下拉后你会得到:
<div id="console">tap on drop menu focus on input 2</div>
stopImmediatePropagation()方法并不能帮助。
在Chrome浏览器中的一切似乎不错。我可以在“Mobile Safari”和“Opera Mobi”上重现它。我在使用“Safari”浏览器的项目中使用phonegap。 – Anton 2013-03-14 08:37:40