javascript - jquery 基于另一个输入禁用一个输入

Question

我有两个输入，其中一个输入被禁用，如果用户将任何内容添加到另一个输入中，则 alt 标签将被删除。这部分工作正常。但如果在第一个输入中预定义了值，我也想禁用相同的输入。有时第一个输入为空，用户必须填写它，有时它具有预定义值，因此应禁用另一个输入并删除 alt 标签。

Tnx

JSFiddle

$('.gsmhr').on('input', function() {
if ($(this).val().length)
$('.gsmslo1').prop('disabled', true).val('').removeAttr("alt");
else $('.gsmslo1').prop('disabled', false);
});

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
This works on user input<br>
<input type="text" name="" value="" class="gsmhr" maxlength="15" size="17" />
<input type="text" name="" value="" class="gsmslo1" alt="simple" maxlength="3" size="1" />
<br><br>
This should work if value is predefined<br>
<input type="text" name="" value="asdf" class="gsmhr" maxlength="15" size="17" />
<input type="text" name="" value="" class="gsmslo1" alt="simple" maxlength="3" size="1" />

Answer 1

$('.gsmhr').on('input', function() {
  if ($(this).val().length)
    $(this).next('.gsmslo1').prop('disabled', true).val('').removeAttr("alt"); // disable and clear other fields
  else $(this).next('.gsmslo1').prop('disabled', false);
}).trigger("input");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
This works on user input<br>
<input type="text" name="" value="" class="gsmhr" maxlength="15" size="17" />
<input type="text" name="" value="" class="gsmslo1" alt="simple" maxlength="3" size="1" />
<br><br> This should work if value is predefined<br>
<input type="text" name="" value="asdf" class="gsmhr" maxlength="15" size="17" />
<input type="text" name="" value="" class="gsmslo1" alt="simple" maxlength="3" size="1" />

1. 使用此上下文
2. 使用.trigger()在加载时触发输入