document.getElementById("test"). style.display = "hidden" не работает

Я хочу скрыть свою форму, когда я нажимаю кнопку отправки. Мой код выглядит следующим образом:

<script type="text/javascript">
    function hide() {
        document.getElementById("test").style.display = "hidden";
    }
</script>
<form method="post" id="test">
    <table width="60%" border="0" cellspacing="2" cellpadding="2">
        <tr style="background:url(../images/nav.png) repeat-x; color:#fff; font-weight:bold"
        align="center">
            <td>Ample Id</td>
            <td>Find</td>
        </tr>
        <tr align="center" bgcolor="#E8F8FF" style="color:#006">
            <td>
                <input type="text" name="ampid" id="ampid" value="<?php echo $_POST['ampid'];?>"
                />
            </td>
            <td>
                <input type="image" src="../images/btnFind.png" id="find" name="find"
                onclick="javascript:hide();" />
            </td>
        </tr>
    </table>
</form>

Но когда я нажимаю кнопку "Найти", эта конкретная форма не скрывается.

Ответы

Ответ 1

Это должно быть либо

document.getElementById("test").style.display = "none";

или

document.getElementById("test").style.visibility = "hidden";

Второй вариант отобразит некоторое пустое место, где форма была первоначально представлена, где, поскольку первый вариант не

Ответ 2

Установите дисплей CSS свойство нет.

document.getElementById("test").style.display = "none";

Кроме того, вам не нужен javascript: для атрибута onclick.

<input type="image" src="../images/btnFind.png" id="find" name="find" 
    onclick="hide();" />

Наконец, убедитесь, что у вас нет нескольких элементов с одинаковым идентификатором.

Если ваша форма никуда не годится, Фил предположил, что вам следует предотвратить подачу формы. Просто return false в обработчик onsubmit.

<form method="post" id="test" onsubmit="return false;">

Если вы хотите, чтобы форма публиковалась, но скрыть div при последующей загрузке страницы, вам придется использовать код на стороне сервера, чтобы скрыть элемент:

<script type="text/javascript">
function hide() {
    document.getElementById("test").style.display = "none";
}
window.onload = function() {
    // if form was submitted, PHP will print the below, 
    //    which runs function hide() on page load
    <?= ($_POST['ampid'] != '') ? 'hide();' : '' ?>
}
</script>

Ответ 4

Использование jQuery:

   $('#test').hide();

Использование Javascript:

document.getElementById("test").style.display="none";

Выбросил сообщение об ошибке " Невозможно установить свойство" отображение неопределенного "

Итак, исправить это будет:

document.getElementById("test").style="display:none";

где ваш html-код будет выглядеть так:

<div style="display:inline-block" id="test"></div>

Ответ 5

Есть два способа сделать это.

Большинство ответов правильно указали, что стиль.display не имеет значения, называемого "скрытым". Это не должно быть.

Если вы хотите использовать "скрытый", синтаксис должен быть следующим.

object.style.visibility="hidden"

Разница между ними заключается в том, что свойство visibility = "hidden" скроет только содержимое вашего элемента, но сохранит его на странице. В то время как display = "none" скроет ваш полный элемент, а остальные элементы на странице заполнит созданную им пустоту.

Проверьте этот рисунок

Ответ 6

его элемент блока, и вам не нужно использовать none

document.getElementById("test").style.display="none"

hidden используется для visibility

Ответ 7

вам нужно использовать display = none

скрытая ценность связана с атрибутом, называемым visibility

поэтому ваш код должен выглядеть так

<script type="text/javascript">
function hide(){
document.getElementById("test").style.display="none";
}
</script>

Ответ 8

это нужно попробовать.

document.getElementById("test").style.display="none";

Ответ 9

вы можете использовать что-то вроде этого.... div container

<script type="text/javascript">
function hide(){
document.getElementById("test").innerHTML.style.display="none";
}
</script>
<div id="test">
<form method="post" >

<table width="60%" border="0" cellspacing="2" cellpadding="2"  >
  <tr style="background:url(../images/nav.png) repeat-x; color:#fff; font-weight:bold" align="center">
    <td>Ample Id</td>
    <td>Find</td>
  </tr>

  <tr align="center" bgcolor="#E8F8FF" style="color:#006" >
    <td><input type="text" name="ampid" id="ampid" value="<?php echo $_POST['ampid'];?>" /></td>
   <td><input type="image" src="../images/btnFind.png" id="find" name="find" onclick="javascript:hide();"/></td>
   </tr>

</table>

</form>
</div>

Ответ 10

Через JavaScript

document.getElementById("test").style.display="none";

Через JQuery

$('#test').hide();