脚本在选择单选按钮时禁用文本框

Script to disable a text box on selecting a radio button

本文关键字：文本 选择 单选按钮 脚本      更新时间：2023-09-26

我有两个单选按钮

 <div class="col-md-2">
                @Html.RadioButtonFor(model => model.ReceiveCopyOrders, "true") Yes
            </div>
            <div class="col-md-3">
                @Html.RadioButtonFor(model => model.ReceiveCopyOrders, "false", new { @id = "mailForOrder_no" }) No
            </div>

和文本框

      <div class="col-md-10">
                @Html.TextBoxFor(m => m.OrderEmail, new { @class = "form-control",@id="
mailForOrder" })
        </div>

如果选中了单选NO，我想禁用文本框。

我试过下面的脚本

<script>
    $(document.getElementById('mailForOrder_no')).checked(function () {
        document.getElementById('mailForOrder').disabled = true;
        });

但是复选框没有被禁用。

我做错了什么

你想做这样的事吗? 

<input type="radio" name = "rad" class="rad" value="Yes"/>Yes
<input type="radio" name = "rad" class="rad" value="No"/>No
<input type="text" id="txt" />
<input type="button" onclick="disableTextBox()" />

JavaScript代码:

function disableTextBox() { 
  $(".rad").each(function() {
     if (this.checked && this.value == "No") {
         $("#txt").attr('disabled','disabled');
     }
  });

}

如果你不使用jQuery，就像这样:

样本小提琴 

// Get radios
var rad = document.getElementsByName('mailForOrder_no');
// Disable / Enable element based on value
function disable_by_radio(w, id) {
    document.getElementById(id).disabled = 
        w.checked && w.value === "No";
}
// Update by event
rad[0].onchange = function (e) { disable_by_radio(this, 'mailForOrder'); };
rad[1].onchange = function (e) { disable_by_radio(this, 'mailForOrder'); };
// Initial update
disable_by_radio(rad[1], 'mailForOrder');

与此HTML:

<input type="text" id="mailForOrder" />
<input name="mailForOrder_no" type="radio" value="Yes" />Yes
<input name="mailForOrder_no" type="radio" value="No" checked />No

因为你没有使用jQuery, $()部分，以及为什么你的代码不能工作，是不可能解释的，因为它不是纯Javascript的一部分。

总之，一个大胆的猜测:

单选按钮没有名为checked()的函数，但有一个属性。如果代码的$()部分只传递对象，那么尝试调用属性将导致错误。

我们可以这样做:

function(){ if($('#mailForOrder_no:checked')){$("mailForOrder").attr()"disabled","disabled"}   }
相关文章：