李炎恢_PHP_jQuery EasyUI[022] ~ SearchBox(搜索/搜尋/尋找/查詢框)組件
李炎恢_PHP_jQuery EasyUI[022] ~ SearchBox(搜索/搜尋/尋找/查詢框)組件
參考資料: https://github.com/jash-git/jash-WebSI
GITHUB: https://github.com/jash-git/richie_jQuery_EasyUI
My code:
$(function () {
$('#ss').searchbox({
width : 300,
height : 22,
menu : '#box',
searcher : function (name, value) {
alert(name + '-' + value);
},
prompt : '请输入关键字',
value : '固定的值',
//disabled : true,
});
var m = $('#ss').searchbox('menu');
m.menu('setIcon', {
target : m.menu('findItem', '体育频道').target,
iconCls : 'icon-save',
});
//console.log($('#ss').searchbox('textbox'));
//console.log($('#ss').searchbox('getValue'));
//$('#ss').searchbox('setValue', '123');
//console.log($('#ss').searchbox('getName'));
//$('#ss').searchbox('selectName', 'sports');
//$('#ss').searchbox('destroy');
//$('#ss').searchbox('resize', 500);
//$('#ss').searchbox('disable');
//$('#ss').searchbox('enable');
//$('#ss').searchbox('clear');
$(document).dblclick(function () {
$('#ss').searchbox('reset');
});
});
<!DOCTYPE html>
<html>
<head>
<title>jQuery Easy UI</title>
<meta charset="UTF-8" />
<script type="text/javascript" src="../../easyui_15/jquery.min.js"></script>
<script type="text/javascript" src="../../easyui_15/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../easyui_15/locale/easyui-lang-zh_TW.js" ></script>
<script type="text/javascript" src="js/index.js"></script>
<link rel="stylesheet" type="text/css" href="../../easyui_15/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="../../easyui_15/themes/icon.css" />
<script type="text/javascript">
function qq(name, value) {
alert(name + '-' + value);
}
</script>
</head>
<body>
<!--
<div class="easyui-searchbox" style="width:300px;"
data-options="menu:'#box',prompt:'请输入关键字',searcher:qq"></div>
-->
<div id="ss"></div>
<div id="box">
<div data-options="iconCls:'icon-ok'">所有频道</div>
<div name="sports">体育频道</div>
</div>
</body>
</html>
PDF:
執行結果:
