jquery的popmenu这类的js用delegate或者on应该怎么写 ?

youyiyang 阳狮集团 2018-06-27 05:33:58
大家好!我在使用Spring MVC3.0做项目的时候需要用到jquery的一种popmenu.js来做弹出式菜单,这个在原来的jsp页面上没有问题,但是当我用ajax把后台来的数据拼接后再$("#content").html(theHtml);返回到前端后,原来的popmenu.js就不起作用了。
我查网上资料后知道可以用js的delegate或者on来做,但是我不知道popmenu.js写成代理的方式是怎么写的。
请大神帮忙看下怎么解决这个问题,谢谢!
popmenu.js:

<script>
$(function(){
/* $('#demo_box').popmenu(); */
$('#ListOrLayout').popmenu(
{
'background':'#fff',
'color':'#000',
'focusColor':'#21a0df',
'borderRadius':'0',
'top': '0',
'left': '0',
'border':'1px solid #211d1d'
}
);
/* $('#demo_box_3').popmenu({'width': '200px', 'background':'#223','focusColor':'#ee5','borderRadius':'10px', 'top': '70', 'left': '-40', 'color':'#1265fe','border':'3px solid #0035fe'}); */
})
</script>

下面是我写的delegate的js,但是不起作用:

<script src="${pageContext.request.contextPath}/js/jquery.min.js">
jQuery("#content").on("#ListOrLayout", popmenu(

{'background':'#fff',
'color':'#000',
'focusColor':'#21a0df',
'borderRadius':'0',
'top': '0',
'left': '0',
'border':'1px solid #211d1d'}
));
</script>
...全文
102 点赞 收藏 1
写回复
1 条回复
切换为时间正序
请发表友善的回复…
发表回复
youyiyang 2018-06-27
我看了下popmenu.js的源码,popmenu是扩展方法,那么能不能用代理呢?

/*
jQuery Pop Menu
Version: beta
Author: Guc. http://www.gucheen.pro
Based on jQuery 2.0.3
*/

(function ($) {

$.fn.popmenu = function (options) {

var settings = $.extend({
'controller': true,
'width': '300px',
'background': '#34495e',
'focusColor': '#1abc9c',
'borderRadius': '10px',
'top': '50',
'left': '0',
'iconSize': '100px',
'color': '#fff',
'border': '0px'
}, options);
if (settings.controller === true) {
var temp_display = 'none';
} else {
var temp_display = 'block';
}
var tar = $(this);
var tar_body = tar.children('ul');
var tar_list = tar_body.children('li');
var tar_a = tar_list.children('a');
var tar_ctrl = tar.children('.pop_ctrl');

function setIt() {
tar_body.css({
'display': temp_display,
'position': 'absolute',
'margin-top': -settings.top,
'margin-left': -settings.left,
'background': settings.background,
'width': settings.width,
'float': 'left',
'padding': '0',
'border-radius': settings.borderRadius,
'border': settings.border
});
tar_list.css({
'display': 'block',
'color': settings.color,
'float': 'left',
'width': settings.iconSize,
'height': settings.iconSize,
'text-align': 'center',
'border-radius': settings.borderRadius
});
tar_a.css({
'text-decoration': 'none',
'color': settings.color
});
tar_ctrl.hover(function () {
tar_ctrl.css('cursor', 'pointer');
}, function () {
tar_ctrl.css('cursor', 'default')
});
tar_ctrl.click(function (e) {
e.preventDefault();
tar_body.show('fast');
$(document).mouseup(function (e) {
var _con = tar_body;
if (!_con.is(e.target) && _con.has(e.target).length === 0) {
_con.hide();
}
//_con.hide(); some functions you want
});
});
tar_list.hover(function () {
$(this).css({
'background': settings.focusColor,
'cursor': 'pointer'
});
}, function () {
$(this).css({
'background': settings.background,
'cursor': 'default'
});
});
}
return setIt();

};

}(jQuery));
回复
发动态
发帖子
Java EE
创建于2007-09-28

6.6w+

社区成员

J2EE只是Java企业应用。我们需要一个跨J2SE/WEB/EJB的微容器,保护我们的业务核心组件(中间件),以延续它的生命力,而不是依赖J2SE/J2EE版本。
申请成为版主
社区公告
暂无公告