Таблица событий OnClick не сработает должным образом

Question

Таблица событий OnClick не сработает должным образом

0

Этот код предназначен для отображения и скрытия таблицы на основе нажатия кнопки, однако, похоже, она не переключает ее должным образом. Кто-нибудь знает, что я делаю неправильно?

<body>
    <br>
        <button onclick="toggleTable();" style="position:absolute; top:130px; left:1000; width:200px; height:25px">3-D Model</button>

    <br>
</body>

<script>

    function toggleTable()
{

var status = document.getElementById("modelTable").style.display;

if (status == 'block') {
  document.getElementById("modelTable").style.display="none";
} else {
  document.getElementById("modelTable").style.display="block";
}
}

    <table id="modelTable" border="1" align="right" style="display:block; position:absolute; top:150px; left:1000;">
        <tr>
            <th>
                <a href="google.com"> 3-D Model </a>
            </th>
        </tr>
        <tr>
            <td>
                <a>test1</a>

            </td>
        </tr>
        <tr>
            <td>
                <a>test2</a>
            </td>
        </tr>
    </table>

</script>

user3044179 28 нояб. 2013, в 04:51

Источник

0

ваша разметка недействительна, вам нужно поместить табель внутри тела
Arun P Johny 28 нояб. 2013, в 03:08
0

«Java» - это «JavaScript», а «Car» - «Carpet».
Andrew Thompson 28 нояб. 2013, в 03:17

Теги:

javascript

html

html5

onclick

2 ответа

0

В вашем коде: var status = document.getElementById("modelTable"). Style.display; if (status == 'block') {document.getElementById("modelTable"). style.display = "none"; } else { document.getElementById("modelTable").style.display="block"; } else {document.getElementById("modelTable"). style.display = "block"; } }

Возможно, лучше использовать css:

Css:.hide {display: none; } }

Javascript: document.getElementById('modelTable'). ClassList.toggle('hide');

nappySoft 28 нояб. 2013, в 00:58

Ещё вопросы

ваша разметка недействительна, вам нужно поместить табель внутри тела

Arun P Johny · Accepted Answer · 2013-11-28T00-43-00.000Z

ваша метка недействительна, вам нужно поместить вкладку в тело

<body>
    <br/>
    <button onclick="toggleTable();" style="position:absolute; top:130px; left:1000; width:200px; height:25px">3-D Model</button>
    <br/>
    <table id="modelTable" border="1" align="right" style="display:block; position:absolute; top:150px; left:1000;">
        <tr>
            <th> <a href="google.com"> 3-D Model </a>

            </th>
        </tr>
        <tr>
            <td> <a>test1</a>

            </td>
        </tr>
        <tr>
            <td> <a>test2</a>

            </td>
        </tr>
    </table>
    <script>
        function toggleTable() {
            var table = document.getElementById("modelTable");
            var status = table.style.display;
            if (status == 'block') {
                table.style.display = "none";
            } else {
                table.style.display = "block";
            }
        }
    </script>
</body>

Демо: скрипка