Jquery弹出窗口中的表行对象的更多细节

时间:2015-08-03 14:38:19

标签: jquery html popup

我一直在处理弹出窗体,当从对象表中单击相应的行时,它会提供对象的其他详细信息。

我已将项目列表加载到名为elements的对象列表中。我正在显示如下所示的元素。每个对象包含属性value1,value2,value3,value4和value5。

<div id="tableId" class="tab-content">
    <table id="filteredList">
        <thead>
            <tr>
                <td>Value 1</th>
                <td>Value 2</th>
                <td>Value 3</th>
            </tr>
        </thead>
        <tbody>
            #foreach ($element in $elements)
            <tr class="popupOpen" data-href="#entry1">
                <td>$!{element.value1}</td>
                <td>$!{element.value2}</td>
                <td>$!{element.value2}</td>
            </tr>
            #end
        </tbody>
    </table>
    <div id="entry1" class="largWin">
        <div id="choice">
            <div id="issued" >
                $!{element.value4}
                $!{element.value5}
            </div>
        </div>
        <div align="center">
            <a href="#" class="btn">Back</a>
        </div>
    </div>
</div>

我使用以下内容在点击每一行时显示一个弹出窗口。

$(document).ready(function () {
    $('tr.popupOpen').click(function () {
        var popup = $(this).attr('data-href');
        $(popup).fadeIn(100);
        $(popup).css({
            'margin-top': '20px',
            'margin-left': '40px'
        });
        $('div.tab-content').append('<div id="mask"></div>');

        $('#mask').fadeIn(100);
        return false;
    });

    $('a.btn, #mask').on('click', function () {
        $('#mask , .largWin').fadeOut(100, function () {
            $('#mask').remove();
        });
        return false;
    });
});

从上面可以看出,我在表格中显示值1,2,3,我需要在弹出窗口中显示值4和5。但是我无法将当前点击的element对应的数据带到弹出窗口。

有没有办法将点击的行的整个数据(不仅仅是值1,2,3,而是整个对象)放到弹出窗口,这样我才能显示value4和value5?< / p>

0 个答案:

没有答案