如何在锚点击时使用colorbox.js弹出?

时间:2015-07-07 05:01:13

标签: javascript jquery asp.net colorbox

我有一个层次结构模块,它创建一个表格,在锚点标签上点击我想要弹出一个与该字段相关的值。但是在我的代码中,它没有进入.click in jquery。在我看来 enter image description here

正如您所看到的那样,层次结构是动态创建的,但是在员工或8中点击时,它不会进入我的功能。

我的代码:

sb.Append("<div class='sfGridwrapper'>");
sb.Append("<table class='positiontable'>");
sb.Append("<thead><th>position name</th><th>poscount</th></thead>");
sb.Append("<tbody>");
foreach (var item in a)
{
    string[] words = item.Split('_');
    sb.Append("<tr>"); 
    foreach (string word in words)
    {
        sb.Append("<td>");
        sb.Append("<a href='Javascript:void(0);' class='Popup'>")
        sb.Append("<span data-departname="+ word + " class='popupmembers'>");
        sb.Append(word);
        sb.Append("</span></a></td>");
    }
    sb.Append("</tr>");
}

sb.Append("</tbody></table></div>");

在我的jquery中:

$('.positiontable').on('click', '.popupmembers', function () {
    alert('hello');
    var getPositionName = $(this).closest('td').siblings().eq(0);
    var getDepartmentName = $(this).parents('a').find('span').eq(0).text();
    Hierarchy.GetEmployeeValues(getPositionName, getDepartmentName);
    $(this).colorbox({
        inline: true, 
        href: '#employeeValue',
        closeButton: true,
        onClosed: function () { $('#employeeValue').hide(); }
    });
});

需要弹出的div是

 StringBuilder stb = new StringBuilder();
        stb.Append("<div id='employeeValue'></div>");
        LiteralControl literal = new LiteralControl(stb.ToString());
        PlaceHolderEmployee.Controls.Add(li);

我需要帮助才能在jquery中使用我的函数。任何人都可以指出我在做错的地方。

1 个答案:

答案 0 :(得分:0)

$('Body').on('click', '.popupmembers', function () {
    alert('hello');
    var getPositionName =$(this).closest('td').find('td:eq(0)').Text();
    var getDepartmentName = $(this).parents('a').find('span').eq(0).text();
    Hierarchy.GetEmployeeValues(getPositionName, getDepartmentName);

    $.colorbox({
        inline: true,
        href: '#employeeValue',
        closeButton: true,
        onClosed: function () { $('#employeeValue').hide(); }
    });
});

我制作了一个新的Js文件,并使用所有必需的参数进行初始化,然后将代码放在刚刚为我工作的新js中,以及彩色框刚刚弹出我的数据。