1

在下面的代码中，我使用一个单选按钮来显示两个不同的textarea命名textA和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>

如果我选择textAtextarea 并向其中添加数据，它将在 textbox 下方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"))

这是同一问题的小提琴设置

4

1 回答 1

1

错误 div 的隐藏在您的 textareas 的“keyup”侦听器中执行。只需单击其中一个单选按钮即可切换文本区域。您需要将上滑添加到函数 optionA() 和 optionB()。例如：

function optionA()  {

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

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

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

查看更改后的小提琴：小提琴

于 2013-10-19T00:15:42.333 回答