我想连接表单值和提交后的URL参数，因此在提交表单时，我希望使用现有的提交值预填充表单 - 假设calculate.php保存表单。此外，如果参数将由用户在URL中更改并通过Web浏览器输入，我还希望将表单值与URL参数匹配。我也希望我的from有现有的默认值。以下是这方面的确切示例：https://www.nicehash.com/profitability-calculator以下是我的表单
<form class="form-inline" method="GET" action="calculate.php">
<div class="hardware">
<label>Select hardware</label>
<div class="select">
<select class="selectpicker" data-size="10" id="hardware" name="hardware" required>
<optgroup label="ASIC">
<option value="canaan-creative-avalon-7">Canaan Creative Avalon 7</option><option value="canaan-creative-avalon-6">Canaan Creative Avalon 6</option><option value="gridseed-blade-25mhz">Gridseed Blade [2.5MHz]</option><option value="gekkoscience-2pac-2x-bm1384-usb-stick-miner">GekkoScience 2PAC - 2x BM1384 USB Stick Miner</option><option value="lketc-dragon-miner-1ths">LKETC DRAGON MINER 1TH/S</option><option value="bitmain-antminer-u3">BITMAIN AntMiner U3</option><option value="bitmain-antminer-s3">BITMAIN AntMiner S3</option><option value="bitmain-antminer-s4">BITMAIN AntMiner S4</option><option value="bitmain-antminer-s5">BITMAIN AntMiner S5</option><option value="bitmain-antminer-s7">BITMAIN AntMiner S7</option><option value="bitmain-antminer-s7ln">BITMAIN AntMiner S7LN</option><option value="bitmain-antminer-s9" selected="true">BITMAIN AntMiner S9</option><option value="bitmain-antminer-r4">BITMAIN AntMiner R4</option><option value="bitmain-antminer-l3">BITMAIN AntMiner L3+</option><option value="bitmain-antminer-d3">BITMAIN AntMiner D3</option><option value="innosilicon-a2-terminator">Innosilicon A2 Terminator</option><option value="innosilicon-a4-dominator">Innosilicon A4 Dominator</option><option value="innosilicon-a5-dashmaster-normal-mode">Innosilicon A5 DashMaster - normal mode</option><option value="innosilicon-a5-dashmaster-overclock-mode">Innosilicon A5 DashMaster - overclock mode</option><option value="ibelink-dm384m-x11">iBeLink DM384M X11</option><option value="ibelink-dm22g-x11">iBeLink DM22G X11 </option><option value="x11-miner-450m-pinidea-dr2">X11 miner 450M PinIdea Dr2</option><option value="baikal-x11-asic-mini-miner">Baikal X11 ASIC Mini Miner</option><option value="baikal-x11-x13-x14-x15-qbit-quark-asic-mini-miner">Baikal X11-X13-X14-X15-Qbit-Quark ASIC Mini Miner</option><option value="baikal-giant">Baikal Giant+</option><option value="baikal-giant-x10">Baikal Giant X10</option>
</optgroup>
<optgroup label="GPU">
<option value="AMD-CPU-A6-5400K">AMD CPU A6-5400K</option><option value="amd-cpu-ryzen-7-1700x-400ghz">AMD CPU Ryzen 7 1700X @ 4.00GHz</option><option value="amd-hd-7870">AMD HD 7870</option><option value="amd-r7-360">AMD R7 360</option><option value="amd-hd-7950">AMD HD 7950</option><option value="amd-r7-370">AMD R7 370</option><option value="amd-r9-280x">AMD R9 280X</option><option value="amd-r9-290x">AMD R9 290X</option><option value="amd-r9-380">AMD R9 380</option><option value="amd-r9-380x">AMD R9 380X</option><option value="amd-r9-390">AMD R9 390</option><option value="amd-r9-fury-nano">AMD R9 Fury Nano</option><option value="amd-rx-460-4gb">AMD RX 460 4GB</option><option value="amd-rx-470-4gb">AMD RX 470 4GB</option><option value="amd-rx-480-8gb">AMD RX 480 8GB</option><option value="amd-rx-550-4gb">AMD RX 550 4GB</option><option value="amd-rx-570-4gb">AMD RX 570 4GB</option><option value="amd-rx-580-4gb">AMD RX 580 4GB</option><option value="amd-rx-580-8gb">AMD RX 580 8GB</option><option value="amd-rx-vega-56">AMD RX Vega 56</option><option value="amd-rx-vega-64">AMD RX Vega 64</option><option value="amd-vega-frontier-edition">AMD Vega Frontier Edition</option><option value="NVIDIA-GTX-560-Ti">NVIDIA GTX 560 Ti</option><option value="NVIDIA-GTX-650-Ti">NVIDIA GTX 650 Ti</option><option value="nvidia-gtx-750-ti">NVIDIA GTX 750 Ti</option><option value="nvidia-geforce-930mx">NVIDIA GeForce 930MX</option><option value="nvidia-gtx-960">NVIDIA GTX 960</option><option value="nvidia-gtx-970">NVIDIA GTX 970</option><option value="nvidia-gtx-980">NVIDIA GTX 980</option><option value="nvidia-gtx-980-ti">NVIDIA GTX 980 Ti</option><option value="nvidia-gtx-1050-ti">NVIDIA GTX 1050 Ti</option><option value="nvidia-gtx-1050">NVIDIA GTX 1050</option><option value="nvidia-gtx-1060-6gb">NVIDIA GTX 1060 6GB</option><option value="nvidia-gtx-1070">NVIDIA GTX 1070</option><option value="nvidia-gtx-1080-ti">NVIDIA GTX 1080 Ti</option><option value="nvidia-gtx-1080">NVIDIA GTX 1080</option><option value="nvidia-gtx-1070-ti">NVIDIA GTX 1070 Ti</option>
</optgroup>
<optgroup label="CPU">
<option value="intel-cpu-q9450-266ghz">Intel CPU Q9450 @ 2.66GHz</option><option value="intel-cpu-g1840-280ghz">Intel CPU G1840 @ 2.80GHz</option><option value="intel-cpu-g2030-300ghz">Intel CPU G2030 @ 3.00GHz</option><option value="intel-cpu-i7-3630qm-240ghz">Intel CPU i7-3630QM @ 2.40GHz</option><option value="intel-cpu-i7-6700-340ghz">Intel CPU i7-6700 @ 3.40GHz</option><option value="intel-cpu-i7-6700t-280ghz">Intel CPU i7-6700T @ 2.80GHz</option><option value="intel-cpu-i7-7700k-470ghz">Intel CPU i7-7700K @ 4.70GHz</option>
</optgroup>
</select>
</div>
</div>
<div class="currency">
<label>Currency</label>
<div class="select">
<select class="selectpicker" data-size="10" id="currency" name="currency" required>
<option value="USD" selected="true">USD</option><option value="AUD">AUD</option><option value="BGN">BGN</option><option value="BRL">BRL</option><option value="CAD">CAD</option><option value="CHF">CHF</option><option value="CNY">CNY</option><option value="CZK">CZK</option><option value="DKK">DKK</option><option value="EUR">EUR</option><option value="GBP">GBP</option><option value="HKD">HKD</option><option value="HRK">HRK</option><option value="HUF">HUF</option><option value="IDR">IDR</option><option value="ILS">ILS</option><option value="INR">INR</option><option value="JPY">JPY</option><option value="KRW">KRW</option><option value="MXN">MXN</option><option value="MYR">MYR</option><option value="NOK">NOK</option><option value="NZD">NZD</option><option value="PHP">PHP</option><option value="PLN">PLN</option><option value="RON">RON</option><option value="RUB">RUB</option><option value="SEK">SEK</option><option value="SGD">SGD</option><option value="THB">THB</option><option value="TRY">TRY</option><option value="ZAR">ZAR</option>
</select>
</div>
</div>
<div class="electricity">
<label>Electricity costs</label>
<input type="text" id="electricity" value="0.12" name="electricity" onchange='saveValue(this);' required>
<sub>USD/kWh</sub>
</div>
<button type="submit" class="btn searchbtn btn-lg btn-default btn-red">Calculate</button>
</form>
答案 0 :(得分：1)
在表单末尾使用一些javascript：
<script>
document.getElementById('hardware').value=
"<?php if(isset($_GET['hardware'])) echo $_GET['hardware'];
else echo 'bitmain-antminer-s9';?>";
</script>
您还可以确保$_GET['hardware']的值位于可能值列表中。
此外，您应该删除selected="true"属性。
答案 1 :(得分：0)
我希望以下是有用的 - 它利用javascript来处理查询字符串，然后查询DOM以查找相关的表单元素，如果它们的名称出现在url中，则将元素值设置为查询字符串中的元素值。
<?php
?>
<!doctype html>
<html>
<head>
<meta charset='utf-8' />
<title></title>
<script>
function saveValue(n){
/* nfi */
}
/* utility to process querystring and return it as an object */
function getArgs() {
var a = {};
var p = location.search.substring(1).split("&");
for(var i=0; i < p.length;i++) {
var x = p[i].indexOf('=');
if(x == -1) continue;
a[p[i].substring(0,x)] = unescape(p[i].substring(x+1));
}
return a;
}
document.addEventListener('DOMContentLoaded',function(e){
/* Get the querystring - objectify */
var args=getArgs();
/* Get the various form elements as nodelist/array */
var col=Array.prototype.slice.call( document.querySelectorAll('form.form-inline select, form.form-inline input[type="text"]') );
col.forEach( function(e){
/* If the element name appears in the querystring, set the value accordingly */
if( args.hasOwnProperty( e.name ) ){
e.value=args[ e.name ];
}
});
},false );
</script>
</head>
<body>
<form class="form-inline" method="GET" action="calculate.php">
<div class="hardware">
<label>Select hardware</label>
<div class="select">
<select class="selectpicker" data-size="10" id="hardware" name="hardware" required>
<option value='-1' selected="true">Please Select
<optgroup label="ASIC">
<option value="canaan-creative-avalon-7">Canaan Creative Avalon 7</option>
<option value="canaan-creative-avalon-6">Canaan Creative Avalon 6</option>
<option value="gridseed-blade-25mhz">Gridseed Blade [2.5MHz]</option>
<option value="gekkoscience-2pac-2x-bm1384-usb-stick-miner">GekkoScience 2PAC - 2x BM1384 USB Stick Miner</option>
<option value="lketc-dragon-miner-1ths">LKETC DRAGON MINER 1TH/S</option>
<option value="bitmain-antminer-u3">BITMAIN AntMiner U3</option>
<option value="bitmain-antminer-s3">BITMAIN AntMiner S3</option>
<option value="bitmain-antminer-s4">BITMAIN AntMiner S4</option>
<option value="bitmain-antminer-s5">BITMAIN AntMiner S5</option>
<option value="bitmain-antminer-s7">BITMAIN AntMiner S7</option>
<option value="bitmain-antminer-s7ln">BITMAIN AntMiner S7LN</option>
<option value="bitmain-antminer-s9">BITMAIN AntMiner S9</option>
<option value="bitmain-antminer-r4">BITMAIN AntMiner R4</option>
<option value="bitmain-antminer-l3">BITMAIN AntMiner L3+</option>
<option value="bitmain-antminer-d3">BITMAIN AntMiner D3</option>
<option value="innosilicon-a2-terminator">Innosilicon A2 Terminator</option>
<option value="innosilicon-a4-dominator">Innosilicon A4 Dominator</option>
<option value="innosilicon-a5-dashmaster-normal-mode">Innosilicon A5 DashMaster - normal mode</option>
<option value="innosilicon-a5-dashmaster-overclock-mode">Innosilicon A5 DashMaster - overclock mode</option>
<option value="ibelink-dm384m-x11">iBeLink DM384M X11</option>
<option value="ibelink-dm22g-x11">iBeLink DM22G X11 </option>
<option value="x11-miner-450m-pinidea-dr2">X11 miner 450M PinIdea Dr2</option>
<option value="baikal-x11-asic-mini-miner">Baikal X11 ASIC Mini Miner</option>
<option value="baikal-x11-x13-x14-x15-qbit-quark-asic-mini-miner">Baikal X11-X13-X14-X15-Qbit-Quark ASIC Mini Miner</option>
<option value="baikal-giant">Baikal Giant+</option>
<option value="baikal-giant-x10">Baikal Giant X10</option>
</optgroup>
<optgroup label="GPU">
<option value="AMD-CPU-A6-5400K">AMD CPU A6-5400K</option>
<option value="amd-cpu-ryzen-7-1700x-400ghz">AMD CPU Ryzen 7 1700X @ 4.00GHz</option>
<option value="amd-hd-7870">AMD HD 7870</option>
<option value="amd-r7-360">AMD R7 360</option>
<option value="amd-hd-7950">AMD HD 7950</option>
<option value="amd-r7-370">AMD R7 370</option>
<option value="amd-r9-280x">AMD R9 280X</option>
<option value="amd-r9-290x">AMD R9 290X</option>
<option value="amd-r9-380">AMD R9 380</option>
<option value="amd-r9-380x">AMD R9 380X</option>
<option value="amd-r9-390">AMD R9 390</option>
<option value="amd-r9-fury-nano">AMD R9 Fury Nano</option>
<option value="amd-rx-460-4gb">AMD RX 460 4GB</option>
<option value="amd-rx-470-4gb">AMD RX 470 4GB</option>
<option value="amd-rx-480-8gb">AMD RX 480 8GB</option>
<option value="amd-rx-550-4gb">AMD RX 550 4GB</option>
<option value="amd-rx-570-4gb">AMD RX 570 4GB</option>
<option value="amd-rx-580-4gb">AMD RX 580 4GB</option>
<option value="amd-rx-580-8gb">AMD RX 580 8GB</option>
<option value="amd-rx-vega-56">AMD RX Vega 56</option>
<option value="amd-rx-vega-64">AMD RX Vega 64</option>
<option value="amd-vega-frontier-edition">AMD Vega Frontier Edition</option>
<option value="NVIDIA-GTX-560-Ti">NVIDIA GTX 560 Ti</option>
<option value="NVIDIA-GTX-650-Ti">NVIDIA GTX 650 Ti</option>
<option value="nvidia-gtx-750-ti">NVIDIA GTX 750 Ti</option>
<option value="nvidia-geforce-930mx">NVIDIA GeForce 930MX</option>
<option value="nvidia-gtx-960">NVIDIA GTX 960</option>
<option value="nvidia-gtx-970">NVIDIA GTX 970</option>
<option value="nvidia-gtx-980">NVIDIA GTX 980</option>
<option value="nvidia-gtx-980-ti">NVIDIA GTX 980 Ti</option>
<option value="nvidia-gtx-1050-ti">NVIDIA GTX 1050 Ti</option>
<option value="nvidia-gtx-1050">NVIDIA GTX 1050</option>
<option value="nvidia-gtx-1060-6gb">NVIDIA GTX 1060 6GB</option>
<option value="nvidia-gtx-1070">NVIDIA GTX 1070</option>
<option value="nvidia-gtx-1080-ti">NVIDIA GTX 1080 Ti</option>
<option value="nvidia-gtx-1080">NVIDIA GTX 1080</option>
<option value="nvidia-gtx-1070-ti">NVIDIA GTX 1070 Ti</option>
</optgroup>
<optgroup label="CPU">
<option value="intel-cpu-q9450-266ghz">Intel CPU Q9450 @ 2.66GHz</option>
<option value="intel-cpu-g1840-280ghz">Intel CPU G1840 @ 2.80GHz</option>
<option value="intel-cpu-g2030-300ghz">Intel CPU G2030 @ 3.00GHz</option>
<option value="intel-cpu-i7-3630qm-240ghz">Intel CPU i7-3630QM @ 2.40GHz</option>
<option value="intel-cpu-i7-6700-340ghz">Intel CPU i7-6700 @ 3.40GHz</option>
<option value="intel-cpu-i7-6700t-280ghz">Intel CPU i7-6700T @ 2.80GHz</option>
<option value="intel-cpu-i7-7700k-470ghz">Intel CPU i7-7700K @ 4.70GHz</option>
</optgroup>
</select>
</div>
</div>
<div class="currency">
<label>Currency</label>
<div class="select">
<select class="selectpicker" data-size="10" id="currency" name="currency" required>
<option value='-1' selected="true">Please Select
<option value="USD">USD</option>
<option value="AUD">AUD</option>
<option value="BGN">BGN</option>
<option value="BRL">BRL</option>
<option value="CAD">CAD</option>
<option value="CHF">CHF</option>
<option value="CNY">CNY</option>
<option value="CZK">CZK</option>
<option value="DKK">DKK</option>
<option value="EUR">EUR</option>
<option value="GBP">GBP</option>
<option value="HKD">HKD</option>
<option value="HRK">HRK</option>
<option value="HUF">HUF</option>
<option value="IDR">IDR</option>
<option value="ILS">ILS</option>
<option value="INR">INR</option>
<option value="JPY">JPY</option>
<option value="KRW">KRW</option>
<option value="MXN">MXN</option>
<option value="MYR">MYR</option>
<option value="NOK">NOK</option>
<option value="NZD">NZD</option>
<option value="PHP">PHP</option>
<option value="PLN">PLN</option>
<option value="RON">RON</option>
<option value="RUB">RUB</option>
<option value="SEK">SEK</option>
<option value="SGD">SGD</option>
<option value="THB">THB</option>
<option value="TRY">TRY</option>
<option value="ZAR">ZAR</option>
</select>
</div>
</div>
<div class="electricity">
<label>Electricity costs</label>
<input type="text" id="electricity" value="0.12" name="electricity" onchange='saveValue(this);' required>
<sub>USD/kWh</sub>
</div>
<button type="submit" class="btn searchbtn btn-lg btn-default btn-red">Calculate</button>
</form>
</body>
</html>