19

送信ボタンをクリックしたときにフォームを非表示にしたい。私のコードは次のとおりです。

<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>

しかし、「検索」ボタンをクリックすると、その特定のフォームは非表示になりません。

4

11 に答える 11

50

どちらかである必要があります

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

また

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

2 番目のオプションでは、フォームが最初に存在していた場所に空白が表示されますが、最初のオプションでは表示されません。

于 2013-08-28T06:07:31.583 に答える
12

CSS 表示プロパティをnoneに設定します。

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

また、属性は必要ありませんjavascript:onclick

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

最後に、同じ IDを持つ複数の要素がないことを確認してください。

フォームがどこにも行かない場合、Phil はフォームの送信を停止する必要があると提案しました。単純return falseonsubmitハンドラで。

<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>
于 2013-08-28T05:55:28.597 に答える
10

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>
于 2015-11-09T09:11:36.230 に答える
4

に置き換えhiddenますnoneMDN リファレンスを参照してください。

于 2013-08-28T05:55:24.847 に答える
1

それはブロック要素であり、使用する必要がありますnone

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

hiddenに使用されますvisibility

于 2013-08-28T05:55:31.357 に答える
0

使用する必要がありますdisplay = none

非表示の値は、呼び出された属性に接続されていますvisibility

コードは次のようになります

<script type="text/javascript">
function hide(){
document.getElementById("test").style.display="none";
}
</script>
于 2013-08-28T05:55:43.333 に答える
0

JavaScript 経由

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

Jquery経由

$('#test').hide();
于 2013-08-28T06:06:39.143 に答える