如果物件包含的欄位多于表單中參考的欄位，那么它會中斷，我該如何防止這種情況（https://jsfiddle.net/a4v7p2xg/2/）下面的代碼片段有效。
var data = {
"firstname": "David",
"lastname": "Garcia"
};
$( document ).ready(function() {
Object.keys(data).forEach(key => document.querySelector(`input[data-name="${key}"]`).value = data[key]);
});<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<!-- JS -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg OMhuP IlRH9sENBO0LRn5q 8nbTov4 1p" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj 3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<title></title>
<style type="text/css">
body {
font-family: 'Open Sans', Arial, helvetica, sans-serif;
color: #333333
}
</style>
</head>
<body style="" class="">
<div class="container px-4">
<div class="row gx-5 align-items-center">
<div class="col-2 p-1">First Name</div>
<div class="col p-1"><input name="firstname" data-name="firstname" class="form-control" id="firstname" type="text" /></div>
</div>
<div class="row gx-5 align-items-center">
<div class="col-2 p-1">Last Name</div>
<div class="col p-1"><input name="lastname" data-name="lastname" class="form-control" id="lastname" type="text" /></div>
</div>
</div>
</body>
</html>uj5u.com熱心網友回復：
- 首先
XMLHTTPRequest，您應該使用fetchJS 內置的 api 而不是使用 . 看到這個答案。 - 其次，您可以
value在將data-name屬性添加到每個input對應于要設定其值的物件的值的鍵之后設定輸入的 。我會這樣做：
function addToForm(data){
Object.keys(data).forEach(key => document.querySelector(`[data-name="${key}"]`) == null ? 0 : document.querySelector(`[data-name="${key}"]`).value = data[key])
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/504194.html
標籤：javascript 阿贾克斯 形式 jsp xmlhttp请求