0

警告メッセージがポップアップするときに、ボタンなどの html コントロールを非表示にする必要があります。最初は一部のコントロールが非表示になっていますが、警告メッセージがポップアップするとコントロールが表示されます。警告メッセージのポップアップ時にコントロールを非表示にする方法。下の画像は問題を示しています..

<html>
<head>
<script>
function disableElements()
{
    document.getElementById("name").disabled=true;
    document.getElementById("link").disabled=true;
    document.getElementById("s1").style.display="none";
    document.getElementById("c1").style.display="none";
    document.getElementById("ex1").style.display="none";
    document.getElementById("u1").style.display="none";
    document.getElementById("u2").style.display="none";
    document.getElementById("se1").style.display="none";
    document.getElementById("ladd").style.display="none";
    document.getElementById("ledit").style.display="none";
    document.getElementById("lfind").style.display="none";
    document.getElementById("ldel").style.display="none";
}
function addenable()
{
    document.getElementById("name").disabled=false;
    document.getElementById("link").disabled=false;
    document.getElementById("s1").style.display="inline";
    document.getElementById("c1").style.display="inline";
    document.getElementById("ex1").style.display="inline";
    document.getElementById("a1").style.display="none";
    document.getElementById("e1").style.display="none";
    document.getElementById("f1").style.display="none";
    document.getElementById("d1").style.display="none";
    document.getElementById("u1").style.display="none";
    document.getElementById("u2").style.display="none";
    document.getElementById("ladd").style.display="inline";
    document.getElementById("ledit").style.display="none";
    document.getElementById("lfind").style.display="none";
    document.getElementById("ldel").style.display="none";
}
</script>
</head>
<body onload="disableElements()">
<form method="post" action="#">
<input type="button" name="add" id="a1" value="Add" onclick="addenable()"/>
<input type="button" name="edit" id="e1" value="Edit"/>
<input type="button" name="find" id="f1" value="Find"/> 
<input type="button" name="delete" id="d1" value="Delete"/>
<input type="submit" name="save" id="s1" value="Save"/>
<input type="submit" name="update" id="u1" value="Update"/>
<input type="submit" name="remove" id="u2" value="Update"/>
<input type="reset" name="cancel" id="c1" value="Cancel"/>
<input type="button" name="exit" id="ex1" value="Exit" onclick="javascript:history.go(0);" />

    <table id="tbl1" width="100%" border="0" >
    <tr>
        <td><label>Name :</label></td>
        <td>&nbsp;</td>
        <td><input type="text" name="Name" size="40px" id="name" /></td>
        <td></td>
        <td><label>Website :</label></td>
        <td>&nbsp;</td>
        <td><input type="text" name="Link" size="40px" id="link" /><br/></td>
    </tr>
    <tr>
        <td><input type="button" name="search" id="se1" value="Search"/></td>
    </tr>
</table>
</form>
</body>
</html>

<?php
if(isset($_POST["save"]))
{
    if(($_POST["Name"] == '') || ($_POST["Link"] == ''))
        {
            echo '<script type="text/javascript">alert("insert values....!")</script>';
        }
        else
        {
    $name = $_POST["Name"];
    $link = $_POST["Link"];

        #inserting values
        $insert = mysql_query("INSERT INTO data (Name, Link) VALUES ('$name','$link')");
        if(!$insert)
            {
                //die ("Error". mysql_error());
                echo '<script type="text/javascript">alert("Duplicate Entry!")</script>';
            }
        else
            {
                echo '<script type="text/javascript">alert("Record Save Successflly!")</script>';
            }
    }
}

?>

ここに画像の説明を入力

4

3 に答える 3

4

私があなたなら、このような関数を作成してドキュメント全体をカバーし、alert() を呼び出します。

        function hideAll(){
            var div = $('<div id="div-cover" style="background:rgba(3,3,3,.7);display:block;position:absolute;left:0px;top:0px;z-index:1000;"></div>');
            $(div).width($(document).width()).height($(document).height());
            $(document.body).prepend(div);
        }
        function showAll(){
            $('#div-cover').remove();
        }

そしてそれを次のように呼び出します：

hideAll();
alert();
showAll();

と

特定の要素だけを非表示にする場合。共通点をあげましょう。ここでは、html5 データ属性と javascript querySelectorAll を使用していますが、jQuery は使用していません。

    <input type="button" data-group="grp1" name="add" id="a1" value="Add" onclick="addenable()"/>
    <input type="button" data-group="grp1" name="edit" id="e1" value="Edit"/>
    <input type="button" data-group="grp1" name="find" id="f1" value="Find"/> 
    <input type="button" data-group="grp1" name="delete" id="d1" value="Delete"/>
    <input type="submit" data-group="grp1" name="save" id="s1" value="Save"/>
    <input type="submit" data-group="grp1" name="update" id="u1" value="Update"/>
    <input type="submit" data-group="grp1" name="remove" id="u2" value="Update"/>
    <input type="reset" data-group="grp1" name="cancel" id="c1" value="Cancel"/>
    <input type="button" data-group="grp1" name="exit" id="ex1" value="Exit" onclick="javascript:history.go(0);" />


    <script type="text/javascript">

        function hideAll(){
            var arr = document.querySelectorAll('[data-group="grp1"]');
            for(var i=0;i<arr.length;i++){
                arr[i].style.display = 'none';
            }
        }
        function showAll(){
            var arr = document.querySelectorAll('[data-group="grp1"]');
            for(var i=0;i<arr.length;i++){
                arr[i].style.display = 'inline';
            }
        }
    </script>
于 2012-11-26T10:07:54.973 に答える
2

$("#ex1").hide()jqueryを使ってみる

于 2012-11-26T10:00:37.667 に答える
1

交換：

echo '<script type="text/javascript">alert("Duplicate Entry!")</script>';

と：

echo '<script type="text/javascript">disableElements();alert("Duplicate Entry!");</script>';

これにより、アラートが呼び出されたときにコントロールが非表示になります。

于 2012-11-26T10:00:33.403 に答える