我正在尝试创建一个计算器，为此我有两个下拉菜单，然后基于第二个下拉菜单，我得到的值已经定义了不同的输入字段。我的问题是如何遍历每个输入字段，以便我只能获得选择的那个，并仅显示基于该特定字段的计算。到目前为止，我做到了这一点。
HTML代码：
<!DOCTYPE html>
<html>
<head>
<title>CO-Calculator</title>
</head>
<body>
<div style="width: 500px; margin: 0 auto; background: #000; color: #fff;">
<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
<select id="segmentselector" name="product">
<option value="commodity">MCX</option>
<option value="equity">Equity</option>
</select>
<br><br>
<div id="commodity" class="myclass">
<select id="scripselector" name="segment">
<option value="ALUMINI">ALUMINI</option>
<option value="ALUMINIUM">ALUMINIUM</option>
<option value="COPPER">COPPER</option>
<option value="COPPERM">COPPERM</option>
<option value="CRUDEOIL">CRUDEOIL</option>
<option value="CRUDEOILM">CRUDEOILM</option>
<option value="GOLD">GOLD</option>
<option value="GOLDM">GOLDM</option>
<option value="LEAD">LEAD</option>
<option value="LEADMINI">LEADMINI</option>
<option value="NATURALGAS">NATURALGAS</option>
<option value="NICKEL">NICKEL</option>
<option value="NICKELM">NICKELM</option>
<option value="SILVER">SILVER</option>
<option value="SILVERM">SILVERM</option>
<option value="ZINC">ZINC</option>
<option value="ZINCM">ZINCM</option>
</select>
</div>
<br><br>
<div id="ALUMINI" class="lot">
<label>Lot Size</label>
<input type="text" name="abalumini" value="1000" readonly>
</div>
<div style="display: none;" id="ALUMINIUM" class="lot">
<label>Lot Size</label>
<input type="text" name="abaluminim" value="5000" readonly>
</div>
<div style="display: none;" id="COPPER" class="lot">
<label>Lot Size</label>
<input type="text" name="abcopper" value="1000" readonly>
</div>
<div style="display: none;" id="COPPERM" class="lot">
<label>Lot Size</label>
<input type="text" name="abcopperm" value="250" readonly>
</div>
<div style="display: none;" id="CRUDEOIL" class="lot">
<label>Lot Size</label>
<input type="text" name="abcrudeoil" value="100" readonly>
</div>
<div style="display: none;" id="CRUDEOILM" class="lot">
<label>Lot Size</label>
<input type="text" name="abcrudeoilm" value="10" readonly>
</div>
<div style="display: none;" id="GOLD" class="lot">
<label>Lot Size</label>
<input type="text" name="abgold" value="100" readonly>
</div>
<div style="display: none;" id="GOLDM" class="lot">
<label>Lot Size</label>
<input type="text" name="abgoldm" value="10" readonly>
</div>
<div style="display: none;" id="LEAD" class="lot">
<label>Lot Size</label>
<input type="text" name="ablead" value="5000" readonly>
</div>
<div style="display: none;" id="LEADMINI" class="lot">
<label>Lot Size</label>
<input type="text" name="ableadm" value="1000" readonly>
</div>
<div style="display: none;" id="NATURALGAS" class="lot">
<label>Lot Size</label>
<input type="text" name="abnaturalgas" value="1250" readonly>
</div>
<div style="display: none;" id="NICKEL" class="lot">
<label>Lot Size</label>
<input type="text" name="abnickel" value="250" readonly>
</div>
<div style="display: none;" id="NICKELM" class="lot">
<label>Lot Size</label>
<input type="text" name="abnickelm" value="100" readonly>
</div>
<div style="display: none;" id="SILVER" class="lot">
<label>Lot Size</label>
<input type="text" name="absilver" value="30" readonly>
</div>
<div style="display: none;" id="SILVERM" class="lot">
<label>Lot Size</label>
<input type="text" name="absilverm" value="5" readonly>
</div>
<div style="display: none;" id="ZINC" class="lot">
<label>Lot Size</label>
<input type="text" name="abzinc" value="5000" readonly>
</div>
<div style="display: none;" id="ZINCM" class="lot">
<label>Lot Size</label>
<input type="text" name="abzincm" value="1000" readonly>
</div>
<div style="display: none;" id="equity" class="myclass">
<select name="segment">
<option>AXISBANK</option>
<option>TCS</option>
<option>WIPRO</option>
</select>
</div>
<br><br>
<input type="text" name="price" placeholder="price" required><br><br>
<input type="text" name="stoploss" placeholder="Stop Loss" required> <br><br>
<button type="submit" class="login100-form-btn" name="getdata">Get Data</button>
</form>
</div>
</body>
</html>
JQuery代码：
<script type="text/javascript">
$(function() {
$('#segmentselector').change(function() {
$('.myclass').hide();
$('#' + $(this).val()).show();
});
});
</script>
<script type="text/javascript">
$(function() {
$('#scripselector').change(function() {
$('.lot').hide();
$('#' + $(this).val()).show();
});
});
</script>
PHP代码：
<?php
function calculator()
{
if (isset($_POST['getdata'])) {
$price = $_POST['price'];
$stoploss = $_POST['stoploss'];
$lowertrigger = 0.25;
$Additional = 0.011;
$abalumini = $_POST['abalumini'];
$abaluminim = $_POST['abaluminim'];
$abcopper = $_POST['abcopper'];
$abcopperm = $_POST['abcopperm'];
$abcrudeoil = $_POST['abcrudeoil'];
$abcrudeoilm = $_POST['abcrudeoilm'];
$abgold = $_POST['abgold'];
$abgoldm = $_POST['abgoldm'];
$ablead = $_POST['ablead'];
$ableadm = $_POST['ableadm'];
$abnaturalgas = $_POST['abnaturalgas'];
$abnickel = $_POST['abnickel'];
$abnickelm = $_POST['abnickelm'];
$absilver = $_POST['absilver'];
$absilverm = $_POST['absilverm'];
$abzinc = $_POST['abzinc'];
$abzincm = $_POST['abzincm'];
$X = $price * $abalumini * $lowertrigger * $Additional;
if ($abalumini) {
$Y = ($price - $stoploss) * $abalumini;
}
if ($Y > $X) {
echo "$Y";
} else {
echo "$X";
}
}
}
calculator();
?>
答案 0 :(得分：0)
假设您要检索与<select id="scripselector" name="segment">中所选选项相对应的输入值，您需要一种方法来映射前value的{{1}}和select所需的name。
因此，我建议您修改HTML，以便input的{{1}}和values匹配select：
names然后在PHP代码中，您可以检索所选的输入值：
inputs最后，你的PHP函数变成这样：
<!-- SELECT remains the same -->
<div id="commodity" class="myclass">
<select id="scripselector" name="segment">
<option value="ALUMINI">ALUMINI</option>
<option value="ALUMINIUM">ALUMINIUM</option>
<option value="COPPER">COPPER</option>
<!-- etc. -->
</select>
</div>
<br><br>
<!-- names are modified to match the select value -->
<div id="ALUMINI" class="lot">
<label>Lot Size</label>
<input type="text" name="ALUMINI" value="1000" readonly>
</div>
<div style="display: none;" id="ALUMINIUM" class="lot">
<label>Lot Size</label>
<input type="text" name="ALUMINIUM" value="5000" readonly>
</div>
<div style="display: none;" id="COPPER" class="lot">
<label>Lot Size</label>
<input type="text" name="COPPER" value="1000" readonly>
</div>
<!-- and so on... -->