Question

我正在尝试使用jQuery将焦点添加到文本区域。

$("input[type='checkbox']").click(function(){
  $("#mycbxs input[type ='checkbox']").val("");   
  var radioButtonsChecked = $("input[value='']:checked");
  radioButtonsChecked = $("#mycbxs:checked");
  if(radioButtonsChecked == "B") {
    $("#BAcbx").focus();
  }
 
  if(radioButtonsChecked == "M") {
    $("#MAcbx").focus();
  }
	
  if(radioButtonsChecked == "P") {
    $("#PHDcbx").focus();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="mycbxs">
  <br><strong>&nbsp;</strong>
  <br><input type="checkbox" id="BAcbx" value="B"> BA
  <br><input type="checkbox" id="MAcbx" value="M"> MA
  <br><input type="checkbox" id="PHDcbx" value="P"> PHD
</div>

<div id="myinputs">
  <br><strong>Discipline</strong>
  <br><input type="text" id="BAText" size="30">
  <br><input type="text" id="MAText" size="30">
  <br><input type="text" id="PHDText"  size="30">
</div>

为什么它没有将重点放在选定的文本区域？这很困难，因为HTML没有“名称”属性（这是故意的）。

感谢您的帮助。

Answer 1

您需要使用radioButtonsChecked.val() == "B"代替radioButtonsChecked == "B"。

Answer 2

  $("input[type='checkbox']").click(function(){
   var radioButtonsChecked= $(this).val();
   if(radioButtonsChecked == "B") { $("#BAcbx").focus(); } 
   if(radioButtonsChecked == "M") { $("#MAcbx").focus(); } 
   if(radioButtonsChecked == "P") { $("#PHDcbx").focus(); }
  })

然而在这种情况下我建议单选按钮，所以没有多重选择

Answer 3

您可以使用解决方案

$('input[type="checkbox"]').on('change', function(){
 if($(this).is(':checked')){
  $('#' + $(this).attr('text-id')).focus();
 }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="mycbxs">
  <br><strong>&nbsp;</strong>
  <br><input type="checkbox" id="BAcbx" text-id="BAText" value="B"> BA
  <br><input type="checkbox" id="MAcbx" text-id="MAText" value="M"> MA
  <br><input type="checkbox" id="PHDcbx" text-id="PHDText" value="P"> PHD
</div>

<div id="myinputs">
  <br><strong>Discipline</strong>
  <br><input type="text" id="BAText" size="30">
  <br><input type="text" id="MAText" size="30">
  <br><input type="text" id="PHDText"  size="30">
</div>

我在复选框中使用了一个额外的属性text-id来保留input textbox id

希望这会对你有所帮助。

如何使用type属性获取组中已检查单选按钮的值？

3 个答案: