如何在組合框的選擇上填充文本框的值

我有一個窗體，它有一個組合框和三個文本框。三個文本框是用於計算目的。第一個文本框是金額，第二個是收到的，最後一個是隻讀的，顯示餘額和組合具有值 - 完整，部分和無。如果用戶選擇完整，則接收的文本框應該變爲只讀，並且在文本框中輸入的金額應該出現在收到的文本框中。如果用戶選擇部分，則文本框應該可供用戶輸入金額。如果用戶選擇無，那麼餘額文本框應填入在金額文本框中輸入的值。如何在組合框的選擇上填充文本框的值

<select id="pay" name="pay" tabindex="12"> 
    <option value=""></option>       
    <option value="1">Full</option>       
    <option value="2">Part</option> 
    <option value="3">None</option>        
</select> 
<input type="text" id="amt" name="amt" value="" 
    size ="8" onblur="calculateText()" 
    style="background-color:transparent; color:blue; text-align:right" 
    tabindex="17"/> 
<input type="text" id="resc" name="resc" value="" 
    disabled="disabled" size ="8" onblur="calculateText()" 
    tabindex="18"/> 
<input type="text" id="bal" name="bal" 
    readonly="readonly" value="" size ="8" 
    onblur="calculateText()" tabindex="19"/>

新增的jsfiddle：http://jsfiddle.net/MackieeE/fjXzY/1/

來源

2013-03-04 kumail

與jQuery它會像'$（ '＃BAL'）VAL。（$（ '＃AMT'）VAL（））;' – solarc 2013-03-04 11:35:33

那麼你嘗試過什麼？ HTML中沒有「組合框」，有選擇元素和輸入類型文本元素。 – RobG 2013-03-04 12:09:28

這裏的東西，讓你開始。它或多或少會提出你所問的問題，還有一些可用性問題，因爲你沒有說過在每種情況下應該做什麼，只有有限的一些情況。我會留給你，讓它按你的意願工作。

<script> 

function calculateText(el) { 
    var form = el.form; 
    var idx = form.pay.selectedIndex; 

    if (idx <= 0) { 
    form.reset(); 
    return; 
    } 

    if (form.pay.value == 1) { 
    form.resc.disabled = true; 
    form.resc.value = form.amt.value; 
    form.bal.value = 0; 

    } else if (form.pay.value == 2) { 
    form.resc.disabled = false; 
    form.bal.value = form.amt.value - form.resc.value; 

    } else if (form.pay.value == 3) { 
    form.resc.disabled = true; 
    form.resc.value = 0; 
    form.bal.value = form.amt.value; 
    } 
} 

</script> 

<form> 
    <select name="pay" onchange="calculateText(this);"> 
    <option selected>Please select an option</option>       
    <option value="1">Full     
    <option value="2">Part 
    <option value="3">None 
    </select><br> 
    Amount: <input name="amt" onblur="calculateText(this)"><br> 
    Received: <input name="resc" disabled onblur="calculateText(this)"><br> 
    Balance: <input name="bal" readonly><br> 
    <input type="reset"> 
</form>

來源

2013-03-04 12:38:52 RobG

請使用JavaScript編寫框架下面的代碼在你的jsfiddle和檢查，如果這是你想..

function UpdatePay(n) { 

    if(n.options[n.selectedIndex].value==2){ 
     document.getElementById('amt').style.display='none'; 
     document.getElementById('resc').disabled = false; 
     } 
     if(document.getElementById('pay').value==3){ 
     document.getElementById('bal').value=document.getElementById('amt').value 
     document.getElementById('resc').value=document.getElementById('amt').value 
    } 
    if(document.getElementById('pay').value==2){ 
     document.getElementById('bal').value=document.getElementById('resc').value 
    } 

}  document.getElementById('resc').value=document.getElementById('amt').value 
    } 
    if(document.getElementById('pay').value==2){ 
     document.getElementById('bal').value=document.getElementById('resc').value 
    } 

}

來源

2013-03-04 12:31:08

如何在組合框的選擇上填充文本框的值

回答

相關問題