问题:在JQuery中,有遇到下面的情况,明明有function可是调不到,在console中报错说找不到pictureShow。
<script type="text/javascript">
$(function(){
function <span style="color:#ff0000;">pictureShow</span>(data){
...
}
var frame = new SDEasyUI_Extend.layout.CommonLayout({
...
datagridOptions:{
url:'<c:url value="/admin/resManager/resource/list"/>',
border:false,
striped:false,
columns:[[
{title:'ID',field:'id',width:50},
{title:'预览',field:' ',width:50,formatter:function(val, row, index){if(row.files[0] != null){return "<input id='btnBrowser' type='button' value='...' οnclick=\"<span style="color:#ff0000;">pictureShow</span>('"+row.files[0].id+"');\">";}}},
{title:'状态',field:'approveStatus',width:90,formatter:function(value,row,index){return row.approveStatusStr;}}
]]
}
...
})
</script>
由于datagrid是用jquery显示的,用Jquery动态绑定事件($(document).on("click", ".test", function(){...})的方法似乎也不是很方便。
解决方法:
灵机一动,另外开了个<script type="text/javascript"></script>写function试试,结果就可以了。
<script type="text/javascript">
function pictureShow(data){
...
}
</script>
<script type="text/javascript">
$(function(){
var frame = new SDEasyUI_Extend.layout.CommonLayout({
...
datagridOptions:{
url:'<c:url value="/admin/resManager/resource/list"/>',
border:false,
striped:false,
columns:[[
{title:'ID',field:'id',width:50},
{title:'预览',field:' ',width:50,formatter:function(val, row, index){if(row.files[0] != null){return "<input id='btnBrowser' type='button' value='...' οnclick=\"pictureShow('"+row.files[0].id+"');\">";}}},
{title:'状态',field:'approveStatus',width:90,formatter:function(value,row,index){return row.approveStatusStr;}}
]]
}
...
})
</script>
不知道是不是因为不能在同一个$(function(){...}中的缘故。
PS.
$(function(){...}是$(document).ready(function(){...})的简写形式,
页面加载后需要执行的代码都写在...里面。