最近用了easyui做界面的相關設計,使用過程遇到了各種問題,例如 easyui combobox 在瀏覽器中的不兼容問題等;這裏羅列一下遇到的問題;
1、select標籤在chrome下下拉列表以及顯示問題,官方demo如下
<select class="easyui-combobox" name="state" style="width:200px;"> <option value="AL">Alabama</option> <option value="AK">Alaska</option> <option value="AZ">Arizona</option> <option value="AR">Arkansas</option> </select>
我自己的編寫時代碼如下:
<select class="easyui-combobox" name="state" style="width:200px;"> <option value="AL"> Alabama </option> <option value="AK"> Alaska </option> <option value="AZ"> Arizona </option> <option value="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);