单击按钮时，我想更改表格的颜色

Question

when i click on dropdown then select multiple after that i have show same table repeatedly, But i want to show that table with different colors.I have append a table on click function, but i want to stop append when i click fourth time on button并且当时还改变了表格的颜色我是编码新手..请帮助我！

        <script>
            function yesnoCheck(that) {
                if  (that.value == "single") {
                    document.getElementById("first").style.display = "block";
                    $("#dynamic-forms").empty();
                    document.getElementById("dynamic-forms").style.display = "none";
                    document.getElementById("t1").value = "";
                    $("#dynamic-forms").empty();
                    document.getElementById("t2").value = "";
                    $("#dynamic-forms").empty();
                    document.getElementById("t3").value = "";
                    $("#dynamic-forms").empty();
                    document.getElementById("t4").value = "";
                    $("#dynamic-forms").empty();
                    document.getElementById("t5").value = "";
                    $("#dynamic-forms").empty();
                    document.getElementById("t6").value = "";
                    $("#dynamic-forms").empty();
                    document.getElementById("formButton").value = "";
    
                    // document.getElementById("form1").value = "clear";
                    // this.removeparent(form.firstElementChild);
                
                }
                else {
                    document.getElementById("first").style.display = "none";
                }
                if (that.value == "multiple") {
                    document.getElementById("second").style.display = "block";
                }
                else {
                    document.getElementById("second").style.display = "none";
                }
            }
            // $(document).ready(function () {
                
                $(document).on("click","#tbl1",function (click) {
                    click.preventDefault();
                    this.parentElement.remove();
                })
            
            $(document).ready(function () {
                $("#formButton").click(function () {
                    // document.form1.style.backgroundColor = 'salmon';
                    // event.target.style.backgroundColor = 'salmon';
                    // form1.style.backgroundColor = 'coral';
                    document.getElementById("dynamic-forms").style.display = "block";
                    // form1.style.backgroundColor = 'coral';
                    $("#dynamic-forms").append(
                        `
                        <form id="form1" style="margin-bottom:10px;margin-top:10px">
                            <button style="float:right; margin-right:400px;" type="button1" id="tbl1" value="clear">-</button>
                            <table style="background-color: #91c8e3;">
                            <tr>
                                <td id="location">Location&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                <input type="text" value="`+$("#pan").val()+`">
                                </td>
                                <td>P1 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                <input type="text">
                                </td>
                            </tr>
                                <tr>
                                <td>P2 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                <input type="text">
                                </td>
                        
                                <td>P3 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;
                                <input type="text">
                                </td>
                            </tr>
                                <tr>
                                <td>Sometime  &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                <input type="text">
                                </td>
                        
                                <td>Full day &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                <input type="text">
                                </td>
                            </tr>
                            </table>
                        </form>
                        `
                    )
                    $("#pan").val("");
                 });
            });
            jQuery(function ($) {
                function copyForms($pan, $location) {
                    $(':input[name]', $location).val(function () {
                        return $(':input[name=' + this.name + ']', $pan).val();
                    });
                }
    
                $('#pan').on('click', function () {
                    copyForms($('#pan'), $('#location'));
                });
            });
            
        </script>
    </head>
    
    <body style="background-color: #0979ad; ">
        <br><br>
        <center>
            <div>
                <select id="selector" onchange="yesnoCheck(this);">
                    <option value="select">__Select__</option>
                    <option value="single">Single</option>
                    <option value="multiple">Multiple</option>
                </select>
            </div>
        </center>
        <br><br>
        <center>
            <div id="first" style="display: none;">
                <table id="tbl" style="background-color: #225670ad;">
                    <tr>
                        <td>Location&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                            &nbsp;
                            <input id="t1" type="text">
                        </td>
                        <td>P1 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                            <input id="t2" type="text">
                        </td>
                    </tr>
                    <tr>
                        <td>P2 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                            &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                            <input id="t3" type="text">
                        </td>
    
                        <td>P3&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                            &nbsp;&nbsp;
                            <input id="t4" type="text">
                        </td>
                    </tr>
                    <tr>
                        <td>Sometime &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                            <input id="t5" type="text">
                        </td>
    
                        <td>Full day&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                            <input id="t6" type="text">
                        </td>
                    </tr>
                </table>
            </div>
        </center>
        <center>
            <div id="second" style="display:none;">
                <label>Location</label>
                <input type="text" id="pan" name="pan">
                <button type="button" id="formButton">+</button>// when click on this button
            </div>
        </center>
        <br><br><br>
        <center id="dynamic-forms">
    
        </center> <br><br>
       
    </body>
    </html>

Hello,I am new in coding and this is my code i want to change my table color repeatedly on click function

when i click on dropdown then select multiple after that i have show same table repeatedly, But i want to show that table with different colors.

Answer 1

检查这个资源：

• 如何在 Javascript 中获得随机 RGB？
• https://sebhastian.com/jquery-change-background-color/