easyui combobox使用JSONP加载数据源

  本示例使用JSONP加载easyui combobox的数据源实现跨域请求数据,easyui版本为jQuery EasyUI 1.3.4。

easyui combobox使用JSONP加载数据源

  高版本的jquery可以直接配置url增加jsonp特有参数如url?xxx=?,这样请求的地址非同源域名会自动启用jsonp操作,如果是低版本的jquery,如1.4没有这么智能,需要配置loader对象,因为easyui的默认loader对象中发送ajax的datatype为json。

loader: function(param, success, error){
    var opts = $(this).combobox('options');
    if (!opts.url) return false;
    $.ajax({
        type: opts.method,
        url: opts.url,
        data: param,
        dataType: 'json',
        success: function(data){
            success(data);
        },
        error: function(){
            error.apply(this, arguments);
        }
    });
}

高版本jquery1.8测试源代码

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>ComboBox - jQuery EasyUI Demo</title>
    <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css">
	<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery-1.8.0.min.js"></script>
	<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
	<script>
	    $(function () {
	        $('#combobox').combobox({url:'http://www.w3dev.cn/jsonp.asp?callback=?'});
	    });
	</script>
</head>
<body>
<input id="combobox" />
</body>
</html>

 


原创文章,转载请注明出处:easyui combobox使用JSONP加载数据源

评论(0)Web开发网
阅读(519)喜欢(0)不喜欢(0)easyui开发技巧