我有两个输入文本表单。 当我选择第一个输入形式时,第二个应该被禁用,反之亦然。 这是html:
我有一段代码可以在Chrome中正常使用,但在Firefox中不起作用
<div id='input-container' style="width:155px; height: 30px;">
<input onclick="somefunction()" class="input" style="width: 155px;" id='myText' />
</div>
<br />
<div id='input-container1' style="width:155px; height: 30px;">
<input onclick="somefunction1()" class="input1" style="width: 155px;" id='myText1' />
</div>
这是Jquery:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
// disable all the input boxes
$(".input").attr("disabled", true);
$(".input1").attr("disabled", true);
// add handler to re-enable input boxes on click
$("div:has(.input)").click(function() {
$("#myText").removeAttr("disabled");
$("#myText1").val(" ");
$("#myText1").attr("disabled",true);
});
$("div:has(.input1)").click(function() {
$("#myText1").removeAttr("disabled");
$("#myText").val(" ");
$("#myText").attr("disabled",true);
});
});
</script>
有人知道如何解决这个问题吗?
答案 0 :(得分:1)
我想出了如何解决这个问题。感谢上面的所有建议。这是解决方案:
<强> HTML 强>
<span style="position:relative;">
<input id="text1" type="text" disabled />
<div id = "div1" style="position:absolute; left:0; right:0; top:0; bottom:0; cursor: pointer;" ></div>
</span>
<span style="position:relative;">
<input id="text2" type="text" disabled />
<div id = "div2" style="position:absolute; left:0; right:0; top:0; bottom:0; cursor: pointer;" ></div>
</span>
<强> JS:强>
<script type="text/javascript">
$('#div1').click(function(){
$('#text1').prop("disabled", false).focus();
$('#text2').prop("disabled", true);
$("#text2").val(" ");
});
$('#div2').click(function(){
$('#text1').prop("disabled", true);
$('#text2').prop("disabled", false).focus();
$("#text1").val(" ");
});
</script>
答案 1 :(得分:0)
<强> HTML 强>
<div id='input-container' class="input-container" style="width:155px; height: 30px;">
<input onclick="somefunction()" class="input" style="width: 155px;" id='myText' />
<强>的JavaScript 强>
var containers = $('.input-container'),
inputs = $('.input');
// disable
inputs.attr('disabled','disabled');
containers('click',function() {
inputs.attr('disabled','disabled').val(' ');
$(this).find('.input').removeAttr('disabled').focus();
});
答案 2 :(得分:0)
我刚刚做了:
@{
object attributes = new { @class = "form-control" };
object disabledAttributes = new { @class = "form-control", disabled="disabled" };
}
然后:
@Html.DropDownListFor(model => model.Vehicle_ModelYear, TabVehiclesModel.YearsDropdown, Model.ModelYearEnabled ? attributes : disabledAttributes)