单选按钮内的输入字段不起作用

时间:2018-10-29 15:32:15

标签: javascript html css

我试图使单选按钮的onclick输入字段起作用,但似乎不起作用。

我的小提琴:https://jsfiddle.net/6qoe89j2/8/

$("#ddlMth").hide();
$("input[type='radio']").change(function() {

  if ($(this).val() == "delivery-yes") {
    $("#ddlMth").show();
  } else {
    $("#ddlMth").hide();
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" name="radioFrequency" onclick="myMth()" id="radioFrequency-0" value="delivery-yes" /> Yes.
<input type="radio" name="radioFrequency" id="radioFrequency-0" /> No.
<div class="controls">
  <label id="ddlMth" name="ddlMth" class="car-list-step-label" for="country">Test</label>
  <input id="ddlMth" name="ddlMth" type="text" placeholder="e.g £50" class="form-control car-list-input">
</div>

2 个答案:

答案 0 :(得分:1)

多个元素不能具有相同的ID。我已经更改了标签和输入的ID。

您不需要jQuery,可以使用CSS来实现。

请参见以下代码段:

.controls{
  display:none;
}

input[value="delivery-yes"]:checked ~ .controls {
    display: block;
}
<input type="radio" name="radioFrequency" id="radioFrequency-0" value="delivery-yes" /> Yes.
<input type="radio" name="radioFrequency" id="radioFrequency-0" /> No.
<div class="controls">
  <label id="ddlMthLabel" for="ddlMth" class="ddlMth car-list-step-label">Test</label>
  <input id="ddlMthInput" name="ddlMth" type="text" placeholder="e.g £50" class="ddlMth form-control car-list-input">
</div>

答案 1 :(得分:0)

您为2个元素设置了相同的module CustomTypes include Dry::Types.module # IncludeRelatedObject = Types::String.constructor do |itm| IncludeRelatedObject = CustomTypes::String.constructor do |itm| itm.split(',').map(&:chomp) end end $args = array( 'post_type' => 'events', 'meta_key' => 'date', 'posts_per_page' => -1, 'orderby' => 'meta_value_num', 'order' => 'ASC', 'meta_query'=> array( 'relation' => 'OR', array( 'key' => 'date', 'compare' => '>=', 'value' => date("Y-m-d"), 'type' => 'DATE' ), array( 'key' => 'start_date', 'compare' => '>=', 'value' => date("Y-m-d"), 'type' => 'DATE' ) ) ); 必须是唯一的。 jQuery仅选择第一个,然后将其隐藏。如果要隐藏标签和输入,则应隐藏它们的容器:

id="ddlMth"
id