我正在開發一個 Web 應用程式，我必須使用 GET 請求在表單中呈現復選框，然后使用 POST 請求將選定的表單資料回傳給服務器。但是，一旦我使用 GET 請求收到復選框資料，我就無法執行發布請求。
我使用了 CherryPy Web 框架，這里是供您參考的代碼。
HTML 代碼片段
<div class="wrapper row2">
<div id="container" class="clear">
<!-- Slider -->
<section id="slider">
<div class="division">
<div style="width: 40%; height: 100px; float: left; font-size: 20px">
<form method="post" action="processes">
<label for="storage">Choose size:</label>
<select name="post_storage" id="storage">
<option value="1g">1GB</option>
<option value="5g">5GB</option>
<option value="8g">8GB</option>
<option value="10g">10GB</option>
</select>
<br /><br />
<label for="iodepth">Choose iodepth:</label>
<select name="post_iodepth" id="iodepth">
<option value="15">15</option>
<option value="32">32</option>
<option value="40">40</option>
<option value="64">64</option>
</select>
<br /><br />
<label for="runtime">Choose runtime:</label>
<select name="post_runtime" id="runtime">
<option value="750">750</option>
<option value="1000">1000</option>
<option value="1250">1250</option>
<option value="1700">1700</option>
</select>
<br /><br />
<label for="ramp_time">Choose ramp_time:</label>
<select name="post_ramp" id="ramp_time">
<option value="1">1</option>
<option value="5">5</option>
<option value="8">8</option>
<option value="10">10</option>
</select>
<br /><br />
<label for="numjobs">Choose number of jobs:</label>
<select name="post_jobs" id="numjobs">
<option value="1">1</option>
<option value="4">4</option>
<option value="8">8</option>
<option value="16">16</option>
</select>
</div>
<h6 style="margin: auto;">Select the disks</h6>
<div id="disknumbers" style="margin-left: 40%; height: 100px; font-size: 18px">
<button type="submit" id="disk" style="display: none;">
Submit
</button>
</form>
</div>
</div>
</section>
</div>
</div>
我從 GET 請求收到的所有復選框都將位于 div 標簽內（div 標簽 id="disknumbers"。因此，在選擇所有必需的復選框后，我需要執行 POST 請求（我在按鈕的幫助下提交了表單資料）對提交 POST 請求后必須完成但它不起作用。
Javascript 代碼（用于 GET 請求）
var i = 0;
var j = 0;
var count = 0;
window.onload = function() {
$.get("http://192.168.0.109:8080/g5", function(data){
count = parseInt(data);
myFunc();
});
function myFunc() {
const currentRequest = $.get("http://192.168.0.109:8080/u5", function(datapoint){
document.getElementById("disknumbers").innerHTML = "<label for=" "disk_" j ">" "<" "input " "type=" "checkbox" " id=" "disk_" j " value=" datapoint " name=" "post_name" " hljs-string">"check" ">" datapoint "</label>";
});
if (i < count-1){
setTimeout(function(){myFunc()}, 1);
i = 1;
j = 1;
} else{
i = 0;
j = 0;
};
};};
POST 請求的 Javascript 代碼
const element = document.getElementById("build");
element.addEventListener("click", myFunction);
function myFunction() {
document.getElementById("disk").click();
}
我希望有人理解這個問題。提前致謝。
uj5u.com熱心網友回復：
如果我明白你的意思..你可以使用addClass按鈕 :not選擇器..見下一個例子
$(document).on("click" , "button#disk:not(.goPost)" , function(e){
e.preventDefault();
console.log("Chechboxes Added From Get request");
$(this).addClass("goPost").text("Submit Now");
})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form method="post">
<button type="submit" id="disk">Add Checkbox</button>
</form>轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/461016.html