问题遇到的现象和发生背景
使用easyui-combobox,通过js加载的数据,不能选择
代码就很简单,没有重复的控件名称,也没有重复渲染,也没有重复的value和text
用代码块功能插入代码,请勿粘贴截图
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>基本会话 - jQuery jQuery EasyUI移动端组件功能在线演示</title>
<link rel="stylesheet" type="text/css" href="jquery-easyui-1.8.6/themes/metro/easyui.css">
<link rel="stylesheet" type="text/css" href="jquery-easyui-1.8.6/themes/mobile.css">
<link rel="stylesheet" type="text/css" href="jquery-easyui-1.8.6/themes/icon.css">
<script type="text/javascript" src="jquery-easyui-1.8.6/jquery.min.js"></script>
<script type="text/javascript" src="jquery-easyui-1.8.6/jquery.easyui.min.js"></script>
<script type="text/javascript" src="jquery-easyui-1.8.6/jquery.easyui.mobile.js"></script>
</head>
<body>
<div class="easyui-navpanel" style="position:relative">
<header>
<div class="m-toolbar">
<div class="m-title">基本会话</div>
</div>
</header>
** <select id="cb1" class="easyui-combobox" label="1:" labelPosition="left" data-options="editable:true,valueFiled:'ruleId',textField:'name'" style="width:100%;" >
</select>
<select id="cb2" class="easyui-combobox" label="2:" labelPosition="left" style="width:100%;" >
<option value="male">儿子</option>
<option value="female">女儿</option>
</select>
</div>
<script type="text/javascript">
// 启动页面加载数据
$(function(){
var data = JSON.parse("[{\"ruleId\":\"001\",\"name\":\"啊额\"},{\"ruleId\":\"002\",\"name\":\"哦一\"}]");
$('#cb1').combobox('loadData', data);
});
</script>
**
</body>
</html>
运行结果及报错内容
加载的数据在下拉列表中可以看到,但是不能选择。
cb2,在html中直接写的下拉选项,使用就没有问题
我想要达到的结果
怎么解决combobox不能选择下拉项的问题呢?