如何讓我的HTML表單將正數變為負數？

我目前有以下 HTML 表單；

<form method = "POST" action = "https://script.google.com/macros/s/AKfycbxjxbUoJes8WFs1ybMpsnYbaiJcFI1PkVFf0y0avSdKmsxtys7LKi6Zdr7tmWyw/exec" id = "groceryExpenses" style = "display:none" onsubmit='addExpense(); checkIfExpense();'>
 <div class="row">
  <div>
    <label>Car Name</label>
      <input  name = "Car" id = 'carName' style = "width: 24%;" type="text" placeholder="Enter the car name" id="exampleEmailInput">
     </div>
    </div>
      <div>
         <div>
       <label style = 'padding-bottom: 1pt;' for="exampleEmailInput">Gas Station</label>
         <input name = "Gas Station" id="gasStation" style = "width: 24%;" type="text" placeholder="Enter the gas station" id="exampleEmailInput">
     </div>
                              
  <label>Amount</label>
  <input name = "Amount" id="amount" style = "width: 24%;" type="number" placeholder="Enter amount spent" id="exampleEmailInput">
   </div>
                            
                    
<button type = 'submit' class="button-primary">Add expense</button>
<button type = 'button' class="button-primary" onclick="closeExpenseForm()">Close Form</button>

                    
   </form>

提交后，我想檢查gasStation和的輸入是否carName為空。如果沒有，amount則將轉為負數。我嘗試了以下方法；

function checkIfExpense(){
    if (document.getElementById('gasStation').value.length !==0 && document.getElementById('carName').value.length !==0){
        amount = Math.abs(amount)*-1; //I have instantiated this variable earlier in my JS file.
    }
}

但是，它似乎不起作用。我怎樣才能做到這一點？

uj5u.com熱心網友回復：

使用以下方法設定負數：

document.getElementById('amount').value = amount

嘗試這個：

function checkIfExpense(e) {
    const gasStation = document.getElementById('gasStation').value;
    const carName = document.getElementById('carName').value;
    let amount = document.getElementById('amount').value;
    if (!gasStation || !carName || gasStation == null || carName == null || gasStation == '' || carName == ''){
        amount = amount ? Math.abs(amount)*-1 : 0;
        console.log(amount);
        document.getElementById('amount').value = amount;
    }
}

<div>
    <label>Car Name</label>
    <input  name="Car" id='carName' style="width: 24%;" type="text" placeholder="Enter the car name" id="exampleEmailInput">
</div>
<div>
    <label style = 'padding-bottom: 1pt;' for="exampleEmailInput">Gas Station</label>
    <input name="Gas Station" id="gasStation" style = "width: 24%;" type="text" placeholder="Enter the gas station" id="exampleEmailInput">
</div>
     
<div>
    <label>Amount</label>
    <input name="Amount" id="amount" style="width: 24%;" type="number" placeholder="Enter amount spent" id="exampleEmailInput">
</div>
                                                
<button type='submit' onclick="checkIfExpense()" class="button-primary">Submit</button>

uj5u.com熱心網友回復：

我不確定，你想要達到什么目的。但你也可以這樣做......

  function checkIfExpense(){
  if (document.getElementById('gasStation').value.length !==0 && document.getElementById('carName').value.length !==0){
      var amount = document.getElementById('amount');
        amount = amount.value;
    alert(-amount);
   

} }

uj5u.com熱心網友回復：

您已經擁有的內容的變體似乎可以正常作業。檢查它是否是一個數字，然后回傳負的絕對值。

運行代碼片段，輸入一個值，然后按回車鍵嘗試。

amount = isNaN(amount) ? 0: -Math.abs(amount)

Event Gas Station amount:
<input type="number" id="station" onchange="this.value=isNaN(this.value)?0:-Math.abs(this.value)"  />

標籤：javascript html

上一篇：有沒有辦法讓HTML按鈕像React中的單選按鈕一樣作業？

下一篇：無法理解Javadoc是什么