0

我为数据库更新编写了代码。问题是添加新行后,它显示然后消失..这个页面在服务器端。我试图在Firefox和chrome中打开该页面,它显示然后消失。问题是什么??

<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script>
        //$(function() { alert('hi') })
        $(document).ready(
            function () {
                $("#AddRow").click(
                    function () {
                        if ($('.checkbox').is(':checked')) {
                            {
                                //alert('hi') 
                                var row = document.getElementById("row"); // find row to copy
                                var table = document.getElementById("tabletomodify"); // find table to append to
                                var clone = row.cloneNode(true); // copy children too
                                clone.id = "row0"; // change id or other attributes/contents
                                table.appendChild(clone); // add new row to end of table

                            }

                        }
                    }

                );
            }
        );
    </script>
</head>



<table cellpadding="10" style="border:2px solid black;" id="tabletomodify">

    <tr bgcolor="#360584">
        <td style="border:1px solid black;" colspan="15"><font face="Arial" size="4" color="white"><b><i>Records</i></b></font>
        </td>
    </tr>
    <tr>
        <td>
            <button id="AddRow">Add Row</button>
        </td>
        <td>
            <button id="DuplicateRow">Duplicate Row</button>
        </td>
        <td>
            <button id="DeleteRow">Delete Row</button>
        </td>
    </tr>
    <tr bgcolor="#360584">
        <td><font face="Arial" size="2" color="white">Name </font>
        </td>
        <td><font face="Arial" size="2" color="white">Date of Birth</font>
        </td>
        <td><font face="Arial" size="2" color="white">City</font>
        </td>
        <td><font face="Arial" size="2" color="white">State</font>
        </td>
        <td><font face="Arial" size="2" color="white">Country</font>
        </td>
        <td><font face="Arial" size="2" color="white">Phone Number</font>
        </td>
        <td><font face="Arial" size="2" color="white">Mail ID</font>
        </td>


        <td><font face="Arial" size="2" color="white">Select</font>
        </td>



        <tr id="row">
            <td>
                <select></select>
            </td>
            <td>
                <select></select>
            </td>
            <td>
                <select></select>
            </td>
            <td>
                <select></select>
            </td>
            <td>
                <select></select>
            </td>
            <td>
                <select></select>
            </td>
            <td>
                <select></select>
            </td>
            <td>
                <input type="checkbox" class="checkbox">
            </td>

        </tr>
</table>
4

2 回答 2

0

这是一个老问题,但我最近遇到了类似的问题。原来使用 HTML 标记<button>是问题所在。如果您将按钮放在表单中,它将导致页面重新加载,从而导致您报告的问题。尽管您的表单中没有按钮,但您可能没有准确地向我们发布您页面上的内容?我怀疑是这种情况,因为您的 HTML 中没有正文标记。

最简单的解决方法是< input type="button"/>改用。

于 2016-03-08T18:09:37.837 回答
-1

这是一个使用相同 html 并清理了 JavaScript 的小提琴:http: //jsfiddle.net/krmFU/

$("#AddRow").click(function () {
    if ($('.checkbox').is(':checked')) {
        {
            alert('hi');
            var row = document.getElementById("row"); // find row to copy
            var table = document.getElementById("tabletomodify"); // find table to append to
            var clone = row.cloneNode(true); // copy children too
            clone.id = "row0"; // change id or other attributes/contents
            table.appendChild(clone); // add new row to end of table
        }
    }
});

<table cellpadding="10" style="border:2px solid black;" id="tabletomodify">
    <tr bgcolor="#360584">
        <td style="border:1px solid black;" colspan="15"><font face="Arial" size="4" color="white"><b><i>Records</i></b></font>

        </td>
    </tr>
    <tr>
        <td>
            <button id="AddRow">Add Row</button>
        </td>
        <td>
            <button id="DuplicateRow">Duplicate Row</button>
        </td>
        <td>
            <button id="DeleteRow">Delete Row</button>
        </td>
    </tr>
    <tr bgcolor="#360584">
        <td><font face="Arial" size="2" color="white">Name </font>

        </td>
        <td><font face="Arial" size="2" color="white">Date of Birth</font>

        </td>
        <td><font face="Arial" size="2" color="white">City</font>

        </td>
        <td><font face="Arial" size="2" color="white">State</font>

        </td>
        <td><font face="Arial" size="2" color="white">Country</font>

        </td>
        <td><font face="Arial" size="2" color="white">Phone Number</font>

        </td>
        <td><font face="Arial" size="2" color="white">Mail ID</font>

        </td>
        <td><font face="Arial" size="2" color="white">Select</font>

        </td>
    </tr>
    <tr id="row">
        <td>
            <select></select>
        </td>
        <td>
            <select></select>
        </td>
        <td>
            <select></select>
        </td>
        <td>
            <select></select>
        </td>
        <td>
            <select></select>
        </td>
        <td>
            <select></select>
        </td>
        <td>
            <select></select>
        </td>
        <td>
            <input type="checkbox" class="checkbox" />
        </td>
    </tr>
</table>
于 2013-10-31T18:54:26.217 回答