我正在表中動態創建一個下拉串列，并希望將下拉串列的值設定為當前值（然后用戶可以將其更改為其他值之一）。該行看起來像這樣（有多行）：
在這種情況下，PAR 的值最初應為 2（每行可以有不同的初始值）。
代碼是：
html = "<td style='width : 1%; white-space: nowrap;'><select name='parRating'>"
for (let i = 0; i <= paraArray; i ) {
html = "<option name='parRatingOption' value='" parRatingArray[i] "'>" parRatingArray[i] "</option>"
};
html = "</select></td>";
// set the current option to this.parRating
uj5u.com熱心網友回復：
看來，您需要將“selected”屬性添加到<option>您需要的
像這樣的東西：
html = "<td style='width : 1%; white-space: nowrap;'><select
name='parRating'>";
let selectedValue = "2"; // <--
let selected = "";
for (let i = 0; i <= paraArray; i ) {
selected = parRatingArray[i] == selectedValue ? " selected " : "";
html = "<option " selected " name='parRatingOption' value='" parRatingArray[i]
"'>" parRatingArray[i] "</option>"
};
html = "</select></td>";
// 將當前選項設定為 this.parRating
uj5u.com熱心網友回復：
您可以使用模板文字：
html = `<option name='parRatingOption' value='${parRatingArray[i]}'>${parRatingArray[i]}</option>`
這也有助于避免笨拙的弦線接頭。最佳實踐是創建一個函式，該函式生成 n 個選項，其中選擇了一個：
const generateOptions = (n, selectedOne) => {
let options = ''
for(let i=0; i<n; i ){
options =`<option name='parRatingOption' ${i===selectedOne ? 'selected' : ''} value='${parRatingArray[i]}'>${parRatingArray[i]}</option>`
}
return options;
}
html =`<td style='width : 1%; white-space: nowrap;'>
<select name='parRating'>
${generateOptions(5, 2)}
</select>
</td>`
這會動態生成 5 個輸入，并選擇第二個
uj5u.com熱心網友回復：
我修改了 Abdullokh 和 Alex 的答案，并在選項元素中添加了“selected”：
html = "<td style='width : 1%; white-space: nowrap;'><select name='parRating'>"
for (let i = 0; i <= paraArray; i ) {
if (this.parRating == parRatingArray[i]) {
// set the current option to this.parRating
html = "<option selected name='parRatingOption' value='" parIdArray[i] "'>" parRatingArray[i] "</option>"
}else {
html = "<option name='parRatingOption' value='" parIdArray[i] "'>" parRatingArray[i] "</option>"
}
};
html = "</select></td>";
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/334091.html
標籤：javascript html
上一篇：洗掉動態創建的表單元素