Question

我在将html附加到表的末尾时遇到了一些麻烦，

这是我的代码：

$('[data-custom="view_financiers"]').live('click', function(){

    var product_id = $(this).closest('tr').attr('data-pid');
    var supplier_id = $(this).closest('table').attr('data-custom'); 
    var parent = $(this).closest('tr');

    $(this).hide();

    $.getJSON("get.php", {pid:product_id, sid:supplier_id}, function(data){
        var size = $(data).size();

        if(data == null){

            $(parent).after("<table width='70%' align='center'><tr><td colspan='14'><center><h3>Sorry, this supplier does not have the financiers.</h3></center></td></tr></table>");

        }else{

            var replacingHtml = "<tr colspan='15'><table width='100%' height='350' data-replaced='true' data-rep='"+product_id+"'><tr><th class='system_header'>Financier name</th><th class='system_header'>Address</th><th class='system_header'>Contact number</th><th class='system_header'>Fax number</th><th class='system_header'>Email</th><th class='system_header'>Region</th></tr></table></tr>";

            $.each(data, function(i,json){

                $(replacingHtml).find("[data-replaced='true']").append("<tr><td colspan='2'>"+json.financier_name+"</td><td colspan='2'>"+json.address+"</td><td colspan='2'>"+json.contact_number+"</td><td colspan='2'>"+json.fax_number+"</td><td colspan='2'>"+json.email+"</td><td colspan='2'>"+json.region+"</td><td class='view_hide' data-custom='view_hide'><u>Hide</u></td></tr>");

            });

            $(parent).after(replacingHtml);

        }
    });

});

所以基本上我试图将一个tr附加到一个表元素上，然后在指定的元素之后添加它，但由于某种原因它不起作用，我在firebug中没有收到任何错误。 / p>

关于它可能是什么的任何想法？

提前Thanx！

Answer 1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('[data-custom="view_financiers"]').live('click', function () {
                var product_id = $(this).closest('tr').data('pid');
                var supplier_id = $(this).closest('table').data('custom');
                var parent = $(this).closest('tr');

                $(this).hide();

                var data = [{ "financier_name": "financier_name1", "address": "address1", "contact_number": "contact_number1", "fax_number": "fax_number1", "email": "email1", "region": "region1" }, { "financier_name": "financier_name2", "address": "address2", "contact_number": "contact_number2", "fax_number": "fax_number2", "email": "email2", "region": "region2" }, { "financier_name": "financier_name3", "address": "address3", "contact_number": "contact_number3", "fax_number": "fax_number3", "email": "email3", "region": "region3"}];
                //$.getJSON("get.php", { pid: product_id, sid: supplier_id }, function (data) {

                if (data === null && data.length === 0) {
                    $(parent).after("<table width='70%' align='center'><tr><td colspan='14'><center><h3>Sorry, this supplier does not have the financiers.</h3></center></td></tr></table>");
                } else {
                    var replacingHtml = [];
                    replacingHtml.push('<tr colspan="15"><table width="100%" height="350" data-replaced="true" data-rep="" + product_id + ""><tr><th class="system_header">Financier name</th><th class="system_header">Address</th><th class="system_header">Contact number</th><th class="system_header">Fax number</th><th class="system_header">Email</th><th class="system_header">Region</th></tr>');

                    $.each(data, function (i, entity) {
                        replacingHtml.push("<tr><td colspan='2'>" + entity.financier_name + "</td><td colspan='2'>" + entity.address + "</td><td colspan='2'>" + entity.contact_number + "</td><td colspan='2'>" + entity.fax_number + "</td><td colspan='2'>" + entity.email + "</td><td colspan='2'>" + entity.region + "</td><td class='view_hide' data-custom='view_hide'><u>Hide</u></td></tr>");
                    });

                    replacingHtml.push('</table></tr>');

                    $(parent).after(replacingHtml.join(''));
                }
                //});
            });
        });
    </script>
</head>
<body>
    <table>
        <tr>
            <td>
                <table data-custom="2345">
                    <tr>
                        <th colspan="15">
                            Super Market
                        </th>
                    </tr>
                    <tr data-pid="1">
                        <td colspan="15">
                            <a data-custom="view_financiers">Testing 1</a>
                        </td>
                    </tr>
                    <tr data-pid="2">
                        <td colspan="15">
                            <a data-custom="view_financiers">Testing 2</a>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</body>
</html>

使用jQuery将HTML附加到变量

1 个答案: