jquerypanel的简单介绍

jquery mobile 中的panel显示过长，超出屏幕范围，看不见下面的内容，向上拖也拖不动，还会闪屏，怎么弄

jquerymobile一直都有很多重要的兼容BUG没解决，以前做项目第一个用的他把人都整崩溃了，后面自己写框架做了，速度比JQ快了不是一等级的。 闪屏的BUG最严重的就是 ios系统。这是一个很顽固的bug,也是史上最无解的bug(页面切换非slide，闪屏BUG，虽然有些人用css修正了ios5以上系统的该bug但是也不会完美的解决方案，其实并不是样式的BUG而是js的bug)，直到现在jQuery官方也没解决。

所以我只能告诉你 超出过长怎么解决，在panel里

div data-role="panel" id="mypanel"

    div id="des"

    外面加这个div 设置样式 #des{height:100%;overflow-y:scroll;}

    /div

/div!-- /panel --

我想闪屏也是因为你高度超出造成的吧，设置一个定高100% 然后超出隐藏 以滚动条的形式拖动

相关问答

Q1: 怎样从jQuery panel中取值

html

head

meta http-equiv="Content-Type" content="text/html; charset=UTF-8"

titlejQuery EasyUI/title

link rel="stylesheet" type="text/css" href="../themes/default/easyui.css"

link rel="stylesheet" type="text/css" href="../themes/icon.css"

script type="text/javascript" src="../jquery-1.4.2.min.js"/script

script type="text/javascript" src="../jquery.easyui.min.js"/script

script

$(function(){

$('#p').panel({

title: 'My Panel',

tools: [{ iconCls:'icon-new',handler:function(){alert('new')}},

{iconCls:'icon-save',handler:function(){alert('save')}

}]

});

alert($('#p').parent().find('.panel-title').text());

});

/script

/head

body style="background:#fafafa;"

h1Panel/h1

div id="p" collapsible="true" style="padding:10px;"

Panel Content

/div

/body

/html

-----------------------

说明一下，panel()方法生成的dom大概如下：

div class="panel" style="width: 988px;"

div class="panel-header" style="width: 976px;"

div class="panel-title"My Panel/div

div class="panel-tool"

div class="panel-tool-collapse"/div

div class="icon-save"/div

div class="icon-new"/div

/div

/div

div style="padding: 10px; width: 966px;" collapsible="true" id="p" title="" class="panel-body"

Panel Content

/div

/div

所以$('#p').parent().find('.panel-title').text()就是先获取#p的父节点，再查找class为.panel-title的text，就可以找到了。

Q2: jQuery EasyUI Panel的默认设置

它的这个是默认的，通过CSS控制的，如果你想要修改。只能修改其CSS实现

Q3: 怎么关闭 jquery panel面板

jQuery(document).ready(function(){ jQuery("#panel的ID").hide();//隐藏 jQuery("#panel的ID").click(function(){ jQuery("#panel的ID").show();//显示 }); });