<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" charset="utf-8">
<link rel="stylesheet" href="../ui-desgin/css/jquery.mobile-1.1.2.css" />
<script src="../-desgin/scripts/jquery-1.7.2.js"></script>
<script src="../ui-desgin/scripts/jquery.mobile-1.1.2.js"></script>
<title></title>
<style type="text/css">
.showfield{
}
.touchfield{
}
</style>
<script type="text/javascript">
$(function(){
$(".showfield").hide();
$(".touchfield").unbind("click");
$(".touchfield").bind("click",
function(){
var t = $(this).next(".showfield");
if(t.css("display")!="none")
t.css("display","none");
else
t.css("display","");
}
);
});
</script>
</head>
<body>
<div id="page" data-role="page" data-theme="b">
<div data-role="header">
<h3>测试页面</h3>
</div>
<div id="content" data-role="content">
<div class="touchfield">
<label for="test1">测试1</label>
<input type="radio" id="test1">
</div>
<div class="showfield">123</div>
<div class="touchfield">
<label for="test2">测试2</label>
<input type="radio" id="test2">
</div>
<div class="showfield">456</div>
</div>
</div>
</body>
</html>
这段代码 在pc上chrome 没问题
但是到手机端 点就不好使了
不会把 showfield显示出来
但是 只要把 touchfield div里加几个字 或者把div撑大起来 点撑大的部分 就好使
求解~~
大佬就是大佬 经验丰富不是盖的
在听我描述完这个问题后,大佬给出了3种解决方法 我用的是最后一种
采用代理模式,你不是.类无法触发吗? input能触发吧,ok ,触发input的onclick事件 在里面触发.类的 齐活……
代码修改为
$(".touchfield").find("input:radio").bind("click",
function(){
var t = $(this).parent(".touchfield")
if(t.css("display")!="none")
t.css("display","none");
else
t.css("display","")
});
搞定……