将输入文本乘以2，在另一个输入中回答
更新：
这是我的整个HTML页面。由于这里的特征限制，一些底部已被切断。它只是重复多次以获得理想的结果。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8">
<link rel="stylesheet" href="css/styles-expenses.css">
<title>CashdUp - Expenses</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$("input").keyup(function(){
var getInId = $(this).attr('id');
var getOutId = $('#'+getInId+'_ans').attr('id');
var getInVal = document.getElementById(getInId).value;
if(!isNaN(getInVal)){
var result = (getInVal * 2);
$('#'+getOutId).val(result);
}
else{
$('#'+getOutId).val("");
alert("Please enter a valid number");
}
});
</script>
</head>
<body class="site-body">
<div class="div-1">
<h1 class="message">Expenses</h1>
</div>
<div class="div-2">
<table class="left-table" style="width:50%">
<th><u>Expense</u></th>
<th><u>Weekly</u></th>
<th><u>Fortnightly</u></th>
<th><u>Yearly</u></th>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1_a" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="input1_a_ans" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="outyear1_a" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
</table>
<table class="right-table" style="width:50%">
<th><u>Expense</u></th>
<th><u>Weekly</u></th>
<th><u>Fortnightly</u></th>
<th><u>Yearly</u></th>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<select class="expense-option">
<option>- Select Option -</option>
<option>Car Insurance</option>
<option>Car Loan</option>
<option>Car Park</option>
<option>Car Registration</option>
<option>Car Servicing</option>
<option>Clothes</option>
<option>Credit Card</option>
<option>Dining Out</option>
<option>Donation</option>
<option>Entertainment</option>
<option>Groceries</option>
<option>Health Insurance</option>
<option>Internet</option>
<option>Mobile Phone</option>
<option>Petrol</option>
<option>Rent / Mortgage</option>
<option>Spending / Pocket Money</option>
<option>Sport</option>
<option>Utilities</option>
</select>
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<input class="expense-option-manual" type="text" placeholder="Expense">
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
<tr>
<td class="options">
<input class="expense-option-manual" type="text" placeholder="Expense">
</td>
<td><input class="amount" id="input1" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="output1" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="output2" type="text" placeholder="Yearly $" readonly></td>
</tr>
</body>
</html>
部分底部已被切断。
更新：
我现在还更新了我的所有ID，以便它们不同。
<td><input class="amount" id="week_a" type="text" placeholder="Weekly $"></td>
<td><input class="amount1" id="outfort_a_ans" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount1" id="outyear_a" type="text" placeholder="Yearly $" readonly></td>
它们来自于字母＆＃39; a＆＃39;在信中＆＃39; t＆＃39;将它们分开。
那么我如何实现一个乘法，在每个表格行中我都有输入＆＃34; week_a＆＃34;通过＆＃34; week_t＆＃34;将数字乘以数字2，并将该答案放在输入的相应行中，例如如果将数字2.56放在week_g中，则答案将在outfort_g_ans中为5.12 e.t.c然后为了使其更复杂，将数字5.12乘以26并将该数字显示在outyear_g中为133.12。
2 个答案:
答案 0 :(得分：0)
您可能遇到问题，因为<script>中的代码运行时$(document).ready(function() {
$("#input1").keyup(function(){
var input1 = parseInt($("#input1").val());
if(!isNaN(input1)){
$("#output1").val(input1 * 2);
}
else{
$("#output1").val("");
alert("Please enter a valid number");
}
});
});
不存在。将其放在文档就绪处理程序中：
{{1}}
上述表格数据至少重复19次，所有相同的ID和类别。
我希望你的意思是你要增加每一行的数量。您的id标记在整个HTML文档中应该是唯一的。
答案 1 :(得分：0)
正在使用 Demo
您的代码问题与所有文本框的ID相同。 ID始终唯一。
所以我更改了代码的一些编辑，
$("input").keyup(function(){
var getInId = $(this).attr('id');
var getOutId = $('#'+getInId+'_ans').attr('id');
var getInVal = document.getElementById(getInId).value;
if(!isNaN(getInVal)){
var result = (getInVal * 2);
$('#'+getOutId).val(result);
}
else{
$('#'+getOutId).val("");
alert("Please enter a valid number");
}
});
更新了 Fiddle
<td><input class="amount" id="input_c" type="text" placeholder="Weekly $"></td>
<td><input class="amount" id="input_c_ans" type="text" placeholder="Fortnightly $" readonly></td>
<td><input class="amount" id="input_c_year" type="text" placeholder="Yearly $" readonly></td>
脚本在这里，
var yearResult = (result * 26);
$('#'+getOutyear).val(yearResult);
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？