通过单击字段启用非活动字段

Enabling inactive fields by clicking on field

本文关键字:字段 启用 非活动 单击      更新时间:2023-09-26

是否有可能有一组非活动字段,如果其中一个字段被单击,一些字段成为强制性的,一些代码段运行?例如,你有三个字段,如下所示:

<input type="text" id="gov1" name="gov1">
<input type="text" id="parentb" name="parentb">
<input type="checkbox" name="child" id="child">

这三个字段最初都是不活动的;但假设你点击其中一个字段,它现在使其余的活动和强制,一些代码段运行在字段"parentb"上,它被归为只读。

window.onload = function(event)
{
    var $input2 = document.getElementById('dec');
    var $input1 = document.getElementById('parentb');
    $input1.addEventListener('keyup', function()
    {
        $input2.value = $input1.value;
    });
}

我已经做了一些搜索,但我似乎找不到任何使用这种特定情况下,我是相当新的JavaScript,所以任何形式的帮助将是伟大的。这是可能的使用JavaScript吗?或者类似的事情可能发生吗?

您正在寻找的方法被称为'chained-select'方法。

jQuery框架的使用示例如下:

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
</head>
<body>
<form action="" method="get">
    <label>
    <input name="Government" type="checkbox" value="">Government</label>
    <br>
    <label>
    <input name="Parent" type="checkbox" id="parent_child_group" value="">Parent</label>
    <br>
    <label>Name of Child
    <input type="text" name="parent_child" value="" class="parent_child_group"></label>
    <br>
    <label>Other
    <input type="text" name="parent_other" value="" class="parent_child_group"></label>
</form>
<script type="text/javascript">
    $(document).ready(function () {
         $(function() {
             enable_cb();
             $("#parent_child_group").click(enable_cb);
         });
         function enable_cb() {
             if (this.checked) {
                 $("input.parent_child_group").removeAttr("disabled");
             } else {
                 $("input.parent_child_group").attr("disabled", true);
             }
         }
    });        
    </script>
    </body>
    </html>

JSFiddle的工作示例:http://jsfiddle.net/farondomenic/fg7p8/1/