Question

系统要求用户根据他们的选择（例如3）确定他们想要输入的记录数量，系统会显示三个文本框。

    <?php for($i=1; $i<=$rows; $i++) { ?> // $i is 3 here
      <input type="text" name="company_name[]" id="cn[]"> 
      <input type="text" size="3"name="entertainment[]" id="en[]">
    <?php } ?>

因此，这将生成3行，具有相同的文本框。如果用户在第一行中输入值以进行娱乐，则公司名称应变灰，反之亦然。类似地，它也应该对第2行和第3行执行相同的操作 - 基于它们填充的文本框。

我如何通过js / jquery做到这一点？

P.S：我不是一个优秀的前端开发人员，所以我可以使用我能得到的所有帮助。

感谢。

Answer 1

首先换行然后进入<div> 元素ID应该是唯一的，将其更改为以下

<?php for($i=1; $i<=$rows; $i++) { ?> // $i is 3 here
<div>
<input type="text" name="company_name[]" onchange="grayOther(this);" id="cn_<?php echo $i ?>"> 
<input type="text" size="3"name="entertainment[]" onchange="grayOther(this);" id="en_<?php echo $i ?>">
</div>
<?php } ?>

然后是js。

<script>
function grayOther(elem){
    elem = $(elem); // convert to jquery object

    if (elem.val().length == 0) {
        elem.siblings().prop('disabled',false);
    }else {
        if (elem.is("[name='company_name[]']")){
            elem.siblings("[name='entertainment[]']").prop('disabled',true);
        }else {
            elem.siblings("[name='company_name[]']").prop('disabled',true);
        }
    }
}
</script>

根据用户的选择，禁用在多行上动态生成的文本框

1 个答案: