Question

我有这个jquery来检查页面加载时的单选按钮：

$('input[value="modelos"]').attr('checked',true);

然后我有一个下拉列表：

<select id="talents_meta_category" name="talents_meta_category">
<option value="tab_1495127126289">Modelos</option>
<option value="tab_1495132259463">Música</option>
</select>

只有在选择input[value="modelos"]时以及如何选择<option value="tab_1495127126289">Modelos</option>，我才能如何进行检查？

Answer 1

您可以通过测试select的value属性来检查是否有一个选项

  $(function(){
    if($('#talents_meta_category').val()){
      $('input[name="favorites"][value="modelos2"]').attr('checked',true);
}    
  })

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="talents_meta_category" name="talents_meta_category">
  <option value=""></option>
<option value="tab_1495127126289">Modelos</option>
<option value="tab_1495132259463" selected>Música</option>
</select>
<label for="modelos"><input type="radio" name="favorites" value="modelos"></label>
<label for="modelos"><input type="radio" name="favorites" value="modelos2"></label>

Answer 2

您可以尝试执行此操作，但是我必须在菜单中输入一个空白选项，但是如果不可接受，请告诉我，我会做其他事情。

$("select#talents_meta_category").change(function () {
  if ($(this).val() === "tab_1495127126289") {
    $('input[value="modelos"]').attr('checked',true);
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<select id="talents_meta_category" name="talents_meta_category">
<option></option>
<option value="tab_1495127126289">Modelos</option>
<option value="tab_1495132259463">Música</option>
</select>

<input type="radio" value="modelos">

Answer 3

您可以使用onchange功能。

  $("#talents_meta_category").on('change',function(){
           let value = $(this).children("option:selected").val();
          if(value=="tab_1495127126289"){
              $('input[value="modelos"]').attr('checked',true);
          }else{
       $('input[value="modelos"]').attr('checked',false);
           }
       });

Answer 4

您需要使用以下条件更改条件：

$("select#talents_meta_category").change(function () {
  if ($(this).val() === "tab_1495127126289") {
    $('input[value="modelos"]').attr('checked',true);
  }else{
  	  $('input[value="modelos"]').attr('checked',false);
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="talents_meta_category" name="talents_meta_category">
<option value="">Please Select</option>
<option value="tab_1495127126289">Modelos</option>
<option value="tab_1495132259463">Música</option>
</select>

</br>
 <input type="checkbox" name="modelos 1" value="modelos"> modelos 1<br>
<input type="checkbox" name="modelos 2" value="modelos"> modelos 2<br>
<input type="checkbox" name="modelos 3" value="modelos"> modelos 3<br>

复选框根据条件（选择选项值）动态变化

Answer 5

这样的事情应该可以解决问题：

// Your check the radio on page load
$('input[value="modelos"]').attr('checked', true);

// Check if `modelos` is selected
if ($('input[value="modelos"]').prop('checked')) {
  // Add the `selected` attribute to the <option />
  $('option[value="tab_1495127126289"]').attr('selected', true);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='radio' value='modelos' />
<select id="talents_meta_category" name="talents_meta_category">
<option value="tab_1495127126289">Modelos</option>
<option value="tab_1495132259463">Música</option>
</select>

希望这会有所帮助，

Answer 6

您可以用许多不同的方法来做，这只是一种。...

var checkMe = 'tab_1495127126289';

$(function(){
    $('input[name=talents_meta_category][value=' + checkMe + ']').prop('checked',true)
});

仅当且当选择了下拉列表元素时，才选中单选按钮

6 个答案: