如何根據以前的單選按鈕顯示一組單選按鈕

我有一個帶單選按鈕的表單。當用戶選擇「不適合」時，我希望他們繼續從第二組單選按鈕指示原因。我不希望這些原因顯示，直到他們點擊了「不適合」單選按鈕。如何根據以前的單選按鈕顯示一組單選按鈕

如何在JavaScript或jQuery中完成此操作？

這裏是我的代碼，比較遺憾的是設計

<div class="col-xs-7"> 
 
<input type="radio" name="res" <?php if (isset($res) && $res=="Fit") echo "checked";?> value="Fit">Fit 
 
\t \t \t <br> 
 
<input type="radio" name="res" <?php if (isset($res) && $res=="Unfit") echo "checked";?> value="Unfit">Unfit 
 
\t \t \t <br> 
 
\t <input type="radio" name="res" <?php if (isset($res) && $res=="all") echo "checked";?>value="all">All 
 
\t \t </div> 
 
\t <div class="col-xs-3"> 
 
\t \t </div> 
 
\t \t </div> 
 
\t <div class="col-lg-6"> 
 
\t \t </div> 
 
\t \t </div> 
 
<h4>Reason for being unfit</h4> 
 
\t <hr> 
 
    <div class="row"> 
 
<div class="col-lg-6"> 
 
<div class="col-xs-2"> 
 
</div> 
 
<div class="col-xs-7"> 
 
\t <input type="radio" name="ru" <?php if (isset($ru) && $ru=="Tuberculosis") echo "checked";?> value="Tuberculosis">Tuberculosis 
 
\t br> 
 
\t <input type="radio" name="ru" <?php if (isset($ru) && $ru=="Pneumonia") echo "checked";?> value="Pneumonia">Pneumonia 
 
\t \t \t <br> 
 
\t <input type="radio" name="ru" <?php if (isset($ru) && $ru=="all") echo "checked";?>value="All">All 
 
\t </div> 
 
\t <div class="col-xs-3"> 
 
\t \t </div> 
 
\t \t </div> 
 
\t <div class="col-lg-6"> 
 
\t </div> 
 
\t </div>

來源

2015-10-03 Vista

嘗試以下，

您可以通過上市歸檔到點擊事件的每個單選按鈕然後找到特定單選框的ID，並檢查它是否等於無線電不適合 ..然後依靠我們將顯示下一個單選按鈕集。

$(document).ready(function() { 
 

 
    
 
    $("#unfit-reason").hide(); 
 

 
    // when you click the radio check whether that is radio-unfit 
 
    $("input[name=res]").click(function() { 
 
    if ($(this).attr("id") == "radio-unfit") { 
 
     $("#unfit-reason").show(); 
 
    } else { 
 
     $("#unfit-reason").hide(); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="col-xs-7"> 
 
    <input type="radio" name="res" <?php if (isset($res) && $res=="Fit") echo "checked";?>value="Fit">Fit 
 
    <br> 
 
    <input id="radio-unfit" type="radio" name="res" <?php if (isset($res) && $res=="Unfit") echo "checked";?>value="Unfit">Unfit 
 
    <br> 
 
    <input type="radio" name="res" <?php if (isset($res) && $res=="all") echo "checked";?>value="all">All 
 
</div> 
 
<div class="col-xs-3"> 
 
</div> 
 
</div> 
 
<div class="col-lg-6"> 
 
</div> 
 
</div> 
 
<div id='unfit-reason'> 
 
    <h4>Reason for being unfit</h4> 
 
    <hr> 
 
    <div class="row"> 
 
    <div class="col-lg-6"> 
 
     <div class="col-xs-2"> 
 
     </div> 
 
     <div class="col-xs-7"> 
 
     <input type="radio" name="ru" <?php if (isset($ru) && $ru=="Tuberculosis") echo "checked";?>value="Tuberculosis">Tuberculosis br> 
 
     <input type="radio" name="ru" <?php if (isset($ru) && $ru=="Pneumonia") echo "checked";?>value="Pneumonia">Pneumonia 
 
     <br> 
 
     <input type="radio" name="ru" <?php if (isset($ru) && $ru=="all") echo "checked";?>value="All">All 
 
     </div> 
 
     <div class="col-xs-3"> 
 
     </div> 
 
    </div> 
 
    <div class="col-lg-6"> 
 
    </div> 
 
    </div> 
 
</div>

來源

2015-10-03 03:05:43 jlocker

雖然此代碼段可以解決的問題，[包括一個解釋]（http://meta.stackexchange.com/questions/114762/explaining-entirely-code-based-answers ）真的有助於提高你的帖子的質量。請記住，您將來會爲讀者回答問題，而這些人可能不知道您的代碼建議的原因。 –

@你好我已經添加它作爲註釋裏面的代碼.. – jlocker

@Kyll我也更新了我的文章 – jlocker

使用jQuery，您可以隱藏的原因是加載頁面時，然後告訴他們點擊相應的單選按鈕時。

這個簡單的例子不支持所有可能的導航（即一旦你看到原因，它們仍然可見）。不過，它應該給你這個想法。

請注意，如果表單元素具有唯一ID，那麼它將簡化對錶單元素的操作，因此我已將它們添加到需要的地方。

$(document).ready(function() { 
 
    
 
    // Hide reasons initially 
 
    $("#unfit-reason").hide(); 
 
    
 
    // Show reasons when unfit is clicked 
 
    $("#radio-unfit").click(function() { 
 
     $("#unfit-reason").show(); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="col-xs-7"> 
 
<input type="radio" name="res" <?php if (isset($res) && $res=="Fit") echo "checked";?> value="Fit">Fit 
 
\t \t \t <br> 
 
<input id="radio-unfit" type="radio" name="res" <?php if (isset($res) && $res=="Unfit") echo "checked";?> value="Unfit">Unfit 
 
\t \t \t <br> 
 
\t <input type="radio" name="res" <?php if (isset($res) && $res=="all") echo "checked";?>value="all">All 
 
\t \t </div> 
 
\t <div class="col-xs-3"> 
 
\t \t </div> 
 
\t \t </div> 
 
\t <div class="col-lg-6"> 
 
\t \t </div> 
 
\t \t </div> 
 
<div id='unfit-reason'> 
 
<h4>Reason for being unfit</h4> 
 
\t <hr> 
 
    <div class="row"> 
 
<div class="col-lg-6"> 
 
<div class="col-xs-2"> 
 
</div> 
 
<div class="col-xs-7"> 
 
\t <input type="radio" name="ru" <?php if (isset($ru) && $ru=="Tuberculosis") echo "checked";?> value="Tuberculosis">Tuberculosis 
 
\t br> 
 
\t <input type="radio" name="ru" <?php if (isset($ru) && $ru=="Pneumonia") echo "checked";?> value="Pneumonia">Pneumonia 
 
\t \t \t <br> 
 
\t <input type="radio" name="ru" <?php if (isset($ru) && $ru=="all") echo "checked";?>value="All">All 
 
\t </div> 
 
\t <div class="col-xs-3"> 
 
\t \t </div> 
 
\t \t </div> 
 
\t <div class="col-lg-6"> 
 
\t </div> 
 
\t </div> 
 
    </div>

來源

2015-10-03 02:23:42 Mogsdad

如何根據以前的單選按鈕顯示一組單選按鈕

回答

相關問題