隐藏单选按钮选项

时间:2015-09-28 10:58:05

标签: javascript jquery radio-button

我选择了ValidateUser,我希望如此用户radio buttons开启"最高通话费用"然后它clicks"按成本选择"单选按钮。

参考代码:



hides




谢谢,

肖恩

4 个答案:

答案 0 :(得分:2)

我添加了div,因此我可以识别区域并使用更改功能触发jquery

尝试以下方法:

$("#radioGroup #select_amount input").change(function() {
  if ($(this).val() == "highestcost") {
    $("#select_cost").hide();
  } else {
    $("#select_cost").show();
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<div id="radioGroup">

  <div id="select_amount">
    <h3>Select by Amount: </h3>
    <input type="radio" name="dialinfo" value="mostdialled">
    <label for="mostdialled">Most Dialled Digits</label>
    <br>
    <input type="radio" name="dialinfo" value="highestcost">
    <label for="highestcost">Highest Costing Calls</label>
  </div>
  <br>

  <h3>Select by Location: </h3>
  <input type="radio" name="callLocation">
  <label for="callLocation">Inside the UK</label>
  <br>
  <input type="radio" name="callLocation">
  <label for="callLocation">International</label>

  <div id="select_cost">
    <h3>Select by Cost: </h3>
    <input type="radio" name="costradio">
    <label for="costradio">Less than &pound;1</label>
    <br>
    <input type="radio" name="costradio">
    <label for="costradio">More than &pound;1</label>
    <br>
    <input type="radio" name="costradio">
    <label for="costradio">More than &pound;5</label>
    <br>
    <input type="radio" name="costradio">
    <label for="costradio">More than &pound;10</label>
  </div>

  <h3>Select Duration: </h3>
  <input type="radio" name="callDuration">
  <label for="callDuration">Less than 60s</label>
  <br>
  <input type="radio" name="callDuration">
  <label for="callDuration">More than 60s</label>
  <br>
  <input type="radio" name="callDuration">
  <label for="callDuration">More than 1hr</label>
  <br>
  <input type="radio" name="callDuration">
  <label for="callDuration">More than 5hrs</label>
</div>

答案 1 :(得分:1)

试试这个。,

SELECT t1.ID AS t1_ID,
       t1.col1 AS t1_col1,
       ...
       t2.ID AS t2_ID,
       ...
FROM table1 t1
JOIN table2 t2
  ON ...
SELECT *, 'table1' AS table_origin
FROM table1
UNION ALL
SELECT *, 'table2' AS table_origin
FROM table2

答案 2 :(得分:0)

您可以在广播组的更改时绑定事件,然后在条件下执行您的操作 -

$('input[type=radio][name=dialinfo]').change(function() {
            if (this.value == 'highestcost') {
                $('input[type=radio][name=costradio]').hide();
            }
            else {
            $('input[type=radio][name=costradio]').show();
            }

        });

答案 3 :(得分:0)

你想要 this

这取决于你想要发生什么,然后代码可以改变

 <div id="radioGroup">

   <div id="amount-group">
    <h3>Select by Amount: </h3>
        <input type="radio" name="dialinfo" value="mostdialled" id='mostdialled'> <label for="mostdialled">Most Dialled Digits</label><br>
        <input type="radio" name="dialinfo" value="highestcost" id='highestcost'> <label for="highestcost">Highest Costing Calls</label>
   </div>
<br>

<h3>Select by Location: </h3>
    <input type="radio" name="callLocation"> <label for="callLocation">Inside the UK</label><br>
    <input type="radio" name="callLocation"> <label for="callLocation">International</label>


<h3>Select by Cost: </h3>
    <input type="radio" name="costradio"> <label for="costradio">Less than &pound;1</label><br>
    <input type="radio" name="costradio"> <label for="costradio">More than &pound;1</label><br>
    <input type="radio" name="costradio"> <label for="costradio">More than &pound;5</label><br>
    <input type="radio" name="costradio"> <label for="costradio">More than &pound;10</label>


<h3>Select Duration: </h3>
    <input type="radio" name="callDuration"> <label for="callDuration">Less than 60s</label><br>
    <input type="radio" name="callDuration"> <label for="callDuration">More than 60s</label><br>
    <input type="radio" name="callDuration"> <label for="callDuration">More than 1hr</label><br>
    <input type="radio" name="callDuration"> <label for="callDuration">More than 5hrs</label>
</div>

$(document).ready(function() {
  $('#amount-group').click(function() {
    if ($('#mostdialled').is(':checked') || $('#highestcost').is(':checked')) {
      $('#amount-group').slideUp(1000);
    }
  })
});