Question

所以下面的代码可以生成我的表，但是一旦我注释掉'ABT'的东西，页面就会绘制，但是没有一个事件处理程序可以工作。

我有一个愚蠢的语法错误吗？或者我是否会不正确地生成此页面？也许我会以错误的顺序追加事情？

我对所有网络内容都很陌生，因此对动态页面生成的任何建议也将非常受欢迎。

随之而来的html非常小。真的只有js和css源链接和空体。

$(document).ready(function () {

    var title   = 'Page Title';
    var form    = $('<form></form>').attr('id', 'form1');
    var div     = $('<div></div>').attr('id', 'hasTable');
    var ABT     = $('<div></div>').attr('id', 'ABTHolder');
    var table   = $('<table></table>').attr('id', 'CETable');
    var head    = $('<thead></thead>');
    var tbody   = $('<tbody></tbody>');
    var headRow = $('<tr></tr>');   

    document.title = title;

    $('body').append(form);
    form.append(div);
    div.append(table);

    //$('body').append(ABT);
    //ABT.append("<input type='button' id='ABTbtn' value='Activate Bypass Timer'/>").button();

    //Create column headers
    table.append(head);
    head.append(headRow);
    for( var i=0; i < $headers1.length; ++i)
        {
        var r1 = $('<th></th>').addClass('r90');
        var sp = $('<span></span>').text($headers1[i]);
        if(i > 5)
            {
            r1.addClass('borderCell2').attr('id', 'th' + i);
            }
        r1.append(sp);
        headRow.append(r1);
        }

    //Create default row (i.e. alternative way to create column headers)
    var tr = $('<tr></tr>').attr('id', 'tr0');
    table.append(tbody);
    tbody.append(tr);
    for( var i=0; i < $headers2.length; ++i)
        {
        var td = $('<td></td>').addClass('borderCell2').text($headers2[i]);
        if(i < 7)
            {
            td.attr('id', 'th' + i)
            }
        tr.append(td);
        }   

    $allCells = $("td, th");
    $('#CETable tr').addClass("whiteRow");
    $('#CETable tbody td')
    .on("click", function() {
        $cell = $(this);
        populateVars($(this));

        alert( "ID: " + $trow.find("td:first").text() + " , Value: " + $cell.text() + ",  Header: " + $thid.text() );
    })
    .mouseover(function () {
        $cell = $(this);
        populateVars($(this));

        //Highlight Row
        highlightRow($trid);

        //Highligh Column
        highlightColumn($cell)
    })
    .mouseout(function() {
        $cell = $(this);
        populateVars($(this));

        //Un-highligh row
        unHighlightRow($trid)

        //Un-highlight column
        unHighlightColumn();
    });

//    $('#ABTbtn').on("click", function(){
//      alert('ABT!');
//    });        
});

编辑：我测试了它只是附加了ABTHolder div并关闭了按钮，一切正常。我可以点击td和ABTHolder div。

为什么添加按钮会破坏它？

Answer 1

您应首先创建按钮，然后附加它，然后单击按钮对象。

现在你只是想点击ABT对象。

动态jQuery页面问题

1 个答案: