[英]jquery focus function not working on checkbox
I have a form that contains a checkbox in a row.我有一个包含一行复选框的表单。 I want to focus to that checkbox if any option isn't marked.如果未标记任何选项,我想关注该复选框。
<div class="fila-fila">
<div class="panel">
<div class="panel-heading">
<p class="panel-title oblig-2">Data<span style="display: none;" class="validate_ko_enquesta_radio_button fa fa-times"></span></p>
</div>
</div>
<div class="panel-body tree-col">
<div class="row">
<div class="col-md-6">
<div class="well well-sm" onclick='javascript:remarcarInput("question_4_1_0_0",true,"1","0","4")'>
<div class="icheckbox_square-red" style="position: relative;" aria-checked="false" aria-disabled="false">
<input
value="1"
type="checkbox"
name="question_4_1_0"
id="question_4_1_0_0"
style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; border: 0px none; opacity: 0;"
/>
<ins
class="iCheck-helper"
onclick="showHideIcon(4);"
style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; border: 0px none; opacity: 0;"
></ins>
</div>
<label for="question_4_1_0_0" class="text-oblig">1 </label>
</div>
</div>
<div class="col-md-6">
<div class="well well-sm" onclick='javascript:remarcarInput("question_4_1_0_1",true,"1","0","4")'>
<div class="icheckbox_square-red" style="position: relative;" aria-checked="false" aria-disabled="false">
<input
value="2"
type="checkbox"
name="question_4_1_0"
id="question_4_1_0_1"
style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; border: 0px none; opacity: 0;"
/>
<ins
class="iCheck-helper"
onclick="showHideIcon(4);"
style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; border: 0px none; opacity: 0;"
></ins>
</div>
<label for="question_4_1_0_1" class="text-oblig">2 </label>
</div>
</div>
<div class="col-md-6">
<div class="well well-sm" onclick='javascript:remarcarInput("question_4_1_0_2",true,"1","0","4")'>
<div class="icheckbox_square-red" style="position: relative;" aria-checked="false" aria-disabled="false">
<input
value="3"
type="checkbox"
name="question_4_1_0"
id="question_4_1_0_2"
style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; border: 0px none; opacity: 0;"
/>
<ins
class="iCheck-helper"
onclick="showHideIcon(4);"
style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; border: 0px none; opacity: 0;"
></ins>
</div>
<label for="question_4_1_0_2" class="text-oblig">3 </label>
</div>
</div>
<div class="col-md-6">
<div class="well well-sm" onclick='javascript:remarcarInput("question_4_1_0_3",true,"1","0","4")'>
<div class="icheckbox_square-red" style="position: relative;" aria-checked="false" aria-disabled="false">
<input
value="4"
type="checkbox"
name="question_4_1_0"
id="question_4_1_0_3"
style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; border: 0px none; opacity: 0;"
/>
<ins
class="iCheck-helper"
onclick="showHideIcon(4);"
style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; border: 0px none; opacity: 0;"
></ins>
</div>
<label for="question_4_1_0_3" class="text-oblig">4</label>
</div>
</div>
</div>
</div>
</div>
Then I have a function that is called if the checkbox does not have any marked item.然后我有一个 function 如果复选框没有任何标记的项目,则会调用它。 The params passed to the functions are dynamic.传递给函数的参数是动态的。 Concatening I obtain the current id, of the elem to focus.连接我获得当前 id,要关注的元素。 For example: the id elem: question_4_1_0_1例如: id elem: question_4_1_0_1
function checkCheckBoxShow(tipoMens,valor,numLinea,numGrup,numElem,oblig){
var text=gEnquestaErrorSI;
text=text.replace("#VALOR#",valor);
$("#avisEnquestaError").html(text);
console.log("mnsErrorRadioButton"+"#question_"+numLinea+"_"+numGrup+"_"+numElem+oblig);//params are correct
$("#question_"+numLinea+"_"+numGrup+"_"+numElem+oblig).focus();//FOCUS NOT WORKING
var elements = document.getElementsByClassName('validate_ko_enquesta_radio_button');
var j = 0;
var trobat = false;
var requiredElement = null;
var index = null;
while (!trobat && j<elementsOblig.length){
if(elementsOblig[j].iteracio == numLinea){
trobat=true;
index = j;
}
j++;
}
if (trobat) {
requiredElement = elements[index];
$(requiredElement).show();
}
$('.error-pagina').show();
//$("#avisEnquestaError").css("display","block");
$("#avisEnquestaError").css("display","inline");
console.log("falseeeeeeeeeeeeee");
return false;
}
Even in firefox console if I do this:即使在 firefox 控制台中,如果我这样做:
$("#question_4_1_0_0").focus();
it doesn't focus to that elem.它不关注那个元素。
The problem is that focus() is a basic javascript method and you are trying to apply to a jQuery object.问题是 focus() 是一个基本的 javascript 方法,而您正在尝试应用于 jQuery object。
Try this:尝试这个:
document.getElementById("question_4_1_0_0").focus();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.