Question

在下面的代码中，我使用单选按钮显示两个名为textarea和textA的{{1}} textB

<input onClick="optionA();" type="radio" name="button2" value="Yes" checked /><label>Option A</label>   
<input onClick="optionB();" type="radio" name="button2" value="No" /><label>Option B</label>

<div id="textA" >
<div class="input"><span><textarea  class="textarea" id="textboxA" name="textA" type="text"></textarea></span> </div>   
</div>

<div id="textB" style="display:none;">
<div class="input"><span><textarea  class="textarea" id="textboxB" name="textB" type="text"></textarea></span> </div>   
</div>

<div id="error" style="display:none;"></div>

如果我选择textA textarea并向其添加数据，则会在文本框Currently Textbox A in use下方和textB Currently Textbox B in use下方显示一条消息。我使用下面的代码：

function optionA()  {

$('#textA').prop("disabled",false);
$('#textA').slideDown("fast");


document.getElementById("textboxB").value="";
$('#textB').slideUp("fast");
$('#textB').prop("disabled",true);

}

function optionB()  {

$('#textB').prop("disabled",false);
$('#textB').slideDown("fast");

document.getElementById("textboxA").value="";
$('#textA').slideUp("fast");
$('#textA').prop("disabled",true);

}


$("#textboxA").keyup(function () {

if((!$("#textboxA").val()) || ($("#textA").prop("disabled"))){

$("#error").slideUp("fast");
}
else{

var message;
message ="Currently TextboxA in use";
$("#error").slideDown("fast");
document.getElementById('error').innerHTML=message;

}
});

$("#textboxB").keyup(function () {

if((!$("#textboxB").val()) || ($("#textB").prop("disabled"))){

$("#error").slideUp("fast");
}
else{

var message;
message ="Currently TextboxB in use";
$("#error").slideDown("fast");
document.getElementById('error').innerHTML=message;

}
});

面临的问题：如果我从textA切换到textB，则error div中显示的消息不会隐藏，尽管我为$("#error").slideUp("fast");添加了($("#textA").prop("disabled"))

以下是同一问题的fiddle setup

Answer 1

隐藏错误div是在textareas的“keyup”监听器中执行的。只需单击其中一个单选按钮，即可切换textareas。您需要将幻灯片添加到函数选项A（）和选项B（）。例如：

function optionA()  {

$('#textA').prop("disabled",false);
$('#textA').slideDown("fast");

document.getElementById("textboxB").value="";
$('#textB').slideUp("fast");
$('#textB').prop("disabled",true);

$("#error").slideUp("fast");
}

查看更改过的小提琴：Fiddle

如果在jquery中检查prop（“disabled”）的语句不起作用

1 个答案: