<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ES6动态创建对象中的属性</title>
</head>
<body>
from输入框<input id="from" type="text" onchange="changeEvent(this)">
<br>
to输入框<input id="to" type="text" onchange="changeEvent(this)">
</body>
<script>
/*
DOM元素的change事件,从DOM的this中结构出元素的id和输入的value
*/
function changeEvent({id, value = ''}) {
if(value.trim() == '') {
return;
}
const submitData = {
// 根据元素的id,动态创建对象中的属性,并给输入的value值补足6位
[id == 'from' ? 'fromAttribute' : 'toAttribute']: value.padStart(6, '0'),
};
// 根据元素的id动态的创建访问路径
doAjax(`/testUrl/${id == 'from' ? 'fromLink' : 'toLink' }`, submitData, function({state, singleData}) {
if(state != "SUCCESS") {
return;
}
// 根据id动态的将从后端返回的对象中结构出数据
$(`#${id}`).val(singleData[id == 'from' ? 'fromName' : 'toName']);
})
}
</script>
</html>
ES6动态属性的使用
最新推荐文章于 2023-03-25 20:35:50 发布
124
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
