如果語句為true，則在加載頁面上顯示Hide div

Question

您很快就會發現我對此並不陌生，也沒有任何線索。 我很想幫助一個朋友解決這個項目。 他希望有一個簡單的報價單表單來生成html的報價單，然后將其復制/粘貼到其客戶的私人wordpress頁面上。

表格以如果選擇單選按鈕開始，則顯示div

index.html：

 <html>
<body>
<head>
        <title>Demo Quote Creator</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("input[name='animalvillas']").click(function () {
            if ($("#chkYes1").is(":checked")) {
                $("#dvanimalvillas").show();
            } else {
                $("#dvanimalvillas").hide();
            }
        });
    });
    </script>
<script type="text/javascript"> 
    $(function () {
        $("input[name='animalkidani']").click(function () {
            if ($("#chkYes2").is(":checked")) {
                $("#dvanimalkidani").show();
            } else {
                $("#dvanimalkidani").hide();
            }
        });
    });
        </script>


</head>
<h2>Client Name</h2>
<form name="create" action="welcome.php" method="post" onsubmit="return validateForm();">
 <strong>Last</strong>: <input type="text" name="last" required />, <strong>First</strong>: <input type="text" name="first" required />
<BR />

<h2><strong>Resorts to Include in Quote</strong></h2>

<span><strong>Animal Kingdom Villas</strong></span><BR />
<label for="chkYes1">
    <input type="radio" id="chkYes1" name="animalvillas" />
    Include
</label>
<label for="chkNo1">
    <input type="radio" id="chkNo1" name="animalvillas" />
    Exclude
</label>
<hr />
<div id="dvanimalvillas" style="display: none">
$<input type="text" name="ages" size="7" /> - Value Studio - Standard View (Parking View) | Studio Description: 316sf - One (1) queen bed and one (1) double-size sleeper sofa (Sleeps 4) <br>
</div>

<span><strong>Animal Kingdom Kidani</strong></span><BR />
<label for="chkYes2">
    <input type="radio" id="chkYes2" name="animalkidani" />
    Include
</label>
<label for="chkNo2">
    <input type="radio" id="chkNo2" name="animalkidani" checked />
    Exclude
</label>
<hr />
<div id="dvanimalkidani" style="display: none">
$<input type="text" name="ages" size="7" /> - Value Studio - Standard View (Parking View) | Studio Description: 316sf - One (1) queen bed and one (1) double-size sleeper sofa (Sleeps 4) <br>
</div>


<BR />
<input type="submit" />
</form>

</body>
</html>

現在，在welcome.php上，他只想要index.html上選擇的相關事件。 顯然，這是行不通的，但是希望您能看到我們正在努力實現的目標。

welcome.php

 <head>
        <meta charset="utf-8" />
</head>

<body>

    <div id="dvanimalvillas" <?php
if ($("#chkNo1").is(":checked")) { echo 'style="display:none;"'; } ?>>
       The quote for Animal Kingdom Villas will show here when yes is selected
    </div>      


    <div id="dvanimalkidani" <?php
if ($("#chkNo2").is(":checked")) { echo 'style="display:none;"'; } ?>>
      The quote for Animal Kingdom Kidani will show here when yes is selected
    </div>      




</body>

謝謝您的指示！

Answer 1

在index.html中進行以下更改。 您必須為單選按鈕提供一些值才能獲取其他文件

<label for="chkYes2">
    <input type="radio" id="chkYes2" name="animalkidani" value="Y" />
    Include
</label>
<label for="chkNo2">
    <input type="radio" id="chkNo2" name="animalkidani"  value="N" checked />
    Exclude
</label>

在您的welcome.php中進行以下更改。 我們將使用單選按鈕值來隱藏和顯示div內容。

<div id="dvanimalvillas" <?php echo ($_POST['animalkidani'] == "Y") ? 'style="display:none;"' : '' ; } ?>>
    The quote for Animal Kingdom Villas will show here when yes is selected
</div>      


<div id="dvanimalkidani" <?php echo ($_POST['animalkidani'] == "N") ? 'style="display:none;"' : '' ; } ?>>
    The quote for Animal Kingdom Kidani will show here when yes is selected
</div>

Answer 2

這里發生了很多事情：

您沒有正確使用單選按鈕。 每個無線電選擇在具有相同名稱的每個無線電組內需要一個不同的值。 該值是提交時隨表格發送的值。 看到此鏈接： http : //www.echoecho.com/htmlforms10.htm
在welcome.php中，您需要查看從index.html發送的表單數據，而不是表單中的實際復選框。 看到此鏈接： http : //www.tutorialspoint.com/php/php_get_post.htm

如果語句為true，則在加載頁面上顯示Hide div

問題描述

2 個解決方案

解決方案1
0 已采納 2016-07-12 18:36:44

解決方案2
0 2016-07-12 18:40:03

如果語句為true，則在加載頁面上顯示Hide div

問題描述

2 個解決方案

解決方案1 0 已采納 2016-07-12 18:36:44

解決方案2 0 2016-07-12 18:40:03

解決方案1
0 已采納 2016-07-12 18:36:44

解決方案2
0 2016-07-12 18:40:03