繁体   English   中英

复选框以禁用/启用输入

[英]checkbox to disable/enable input

我正在使用js来选中复选框的onclick,它启用或禁用文本输入。

它有效,直到我使用Google jquery api将其放入实时表单中为止。

很奇怪,但是..一定是某个地方的冲突。

表单元素是:(代码未正确添加到此帖子中)

<input type="checkbox" name="others" onclick="enable_text(this.checked)" class="medium" /></div>

信用卡名称(如果与上面不同)

js是:

function enable_text(status)
{
status=!status;
document.form1.other_name.disabled = status;
}

我在做什么错,我使用了body onload处理程序。

<body onload=enable_text(false);>

JS FIDDLE: http//www.jsfiddle.net/ozzy/H8VPY/4/

在这里,一个jQuery解决方案:

$("input:checkbox").click(function() {
    $("input:text").attr("disabled", !this.checked); 
});

只需将这些通用选择器替换为您更具体的选择器即可。

除此代码外,您可能还希望使文本框(最初)处于禁用状态。

<input type="text" disabled="disabled" />

工作演示: http : //www.jsfiddle.net/H8VPY/11/

您的jsfiddle演示中有几个问题。

  • <script>及其周围的注释应被删除。
  • 缺少<form name="form1"> ,这导致document.form1不返回任何内容。
  • 左侧菜单上的onLoad选项应该是“ no wrap”(头部),因为它只是一个函数。

更新的演示: http : //www.jsfiddle.net/PPZYm/

现场例子

function enable_text(status) {
    status = (status) ? false : true; //convert status boolean to text 'disabled'
    document.form1.other_name.disabled = status;
}

注意

您还需要使用名称为form1<form>标记将div包装在jsfiddle示例中,以使其正常工作

<div class="controlset-pad">
    <input type="checkbox" name="others" onclick="enable_text(this.checked)" class="medium" />
</div>
<form name="form1">
    <div class="field4">
        <label>Name on credit card if different from above</label><input type="text" name="other_name" class="medium" disabled="disabled" />
    </div>
</form>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM