在jquery中選擇單擊時從另一個輸入框分配輸入框值-有解無憂

我有一個表單，其中有 5 個欄位，其中 3 個欄位的值類似于小時、天數和租期，其中包含默認值，然后是一個選擇框和另一個空輸入框，我的代碼如下所示：

$(document).ready(function() {
  $('#hr').change(function() {
    $('#mytexts').val($('#hours').val());
  });
});

<input type="text" id="hours" value="23" readonly/>
<input type="text" id="days" value="33" readonly/>
<input type="text" id="lease" value="33" readonly/>


<select name="hours" id="hr">
  <option value="" onchange="myFunctionhours(this)">---Select---</option>
  <option value="hours">Hours</option>
  <option value="days">Days</option>
  <option value="lease">Lease</option>

</select>

<input type="text" name="crate" id="mytexts" value="" readonly/>

當從 selectBox 中選擇一個值時，我想清空輸入框以相應地從 3 個輸入框中獲取值，現在我所做的只能獲取小時框的值，任何人都可以告訴我如何執行此操作，提前致謝

uj5u.com熱心網友回復：

您必須從更改事件中獲取值，event.target.value 然后使用然后將其后續值分配給結果輸入，如下所示：

  $('#hr').change(function(event) {
    let selected = event.target.value;
     if(selected) $('#mytexts').val($("#" selected).val());
  });

請參閱下面的作業片段：

$(document).ready(function() {
  $('#hr').change(function(event) {
    let selected = event.target.value;
    $("#choise").html(selected)
    if(selected) $('#mytexts').val($("#" selected).val());
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="hours" value="23" readonly/>
<input type="text" id="days" value="33" readonly/>
<input type="text" id="lease" value="33" readonly/>

<br /><br />
<select name="hours" id="hr">
  <option value="" onchange="myFunctionhours(this)">---Select---</option>
  <option value="hours">Hours</option>
  <option value="days">Days</option>
  <option value="lease">Lease</option>

</select>
<br /><br />
<input type="text" name="crate" id="mytexts" value="" readonly/> <span id="choise"></span>

uj5u.com熱心網友回復：

您必須使用下拉值的值作為 JQuery 中的查詢選擇器。

$(document).ready(function() {
  $('#hr').change(function() {
    $('#mytexts').val($("#" $('#hr').val()).val());
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- begin snippet: js hide: false console: true babel: null -->

轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/394556.html

標籤：javascript html 查询选择输入

上一篇：JqueryUi可排序專案選項僅選擇第一項

下一篇：我怎么能把陣列減半