最近用了easyui做界面的相关设计,使用过程遇到了各种问题,例如 easyui combobox 在浏览器中的不兼容问题等;这里罗列一下遇到的问题;

1、select标签在chrome下下拉列表以及显示问题,官方demo如下

<select class="easyui-combobox" name="state" style="width:200px;">
		<option value="http://www.mamicode.com/AL">Alabama</option>
		<option value="http://www.mamicode.com/AK">Alaska</option>
		<option value="http://www.mamicode.com/AZ">Arizona</option>
		<option value="http://www.mamicode.com/AR">Arkansas</option>
</select>

 我自己的编写时代码如下:

<select class="easyui-combobox" name="state" style="width:200px;">
		<option value="http://www.mamicode.com/AL">
		Alabama
		</option>
		<option value="http://www.mamicode.com/AK">
		Alaska
		</option>
		<option value="http://www.mamicode.com/AZ">
		Arizona
		</option>
		<option value="http://www.mamicode.com/AR">
		Arkansas
		</option>
</select>

差异就是在每对<option></option>标签是否换行,调试了很久终于发现这个现象。

2.easyui datagrid的使用 分页自定义处理,安装要求对控件的默认分页图标转换成  首页 上一页   下一页    尾页 这种格式将如下代码放入后发现总是无法渲染成上述自定义的格式:

$("#dg").datagrid({
    onLoadSuccess:function(){
        var pagerTips = ["首页","上一页","下一页","尾页"];
        $(".pagination").find("td:eq(2),td:eq(3),td:eq(9),td:eq(10)").each(function(i){
            $(this).find(".l-btn-text").html(pageTips[i]);
        });
    }
});			

按代码逻辑数据加载成功后进行该段自定义的代码处理,浏览调试中发现已经加载渲染，但是实际展示效果就是没有出现，纠结呀，无论怎么调整就是不出现，网上提示也是这么写法，最后尝试是否因为框架加载数据过快导致页面未来的及渲染这个效果。结果尝试延迟加载代码

$("#dg").datagrid({
    onLoadSuccess:function(){
        setTimeout(function(){var pagerTips = ["首页","上一页","下一页","尾页"];
        $(".pagination").find("td:eq(2),td:eq(3),td:eq(9),td:eq(10)").each(function(i){
            $(this).find(".l-btn-text").html(pageTips[i]);
        });
    }
});},50);

本文出自 “所遇问题总结” 博客，请务必保留此出处http://4184212.blog.51cto.com/4174212/1545190

Jquery EASYUI设计注意点