引用错误:赋值 JavaScript 中的左侧无效

Question

我正在尝试使用 JavaScript 为 HTML 表单分配操作，但是，我收到 ReferenceError：赋值中的左侧无效。

我的代码：

<form action="/" method="POST" name="search-theme-form" id="search-theme-form" >
User <input type="text" name="user" />
Term<input type="text" name="term" />
Subject<input type="text" name="subject" />
Grade<input type="text" name="grade" />
Marks<input type="text" name="marks" />
<script>
var params = (new URL(document.location)).searchParams;
var studentId = params.get("stdid");
var studentId = params.get("stdid");
var x = "app/students/"  + studentId;
document.search-theme-form.action = x;
</script>
<input id="submitButton"  type="submit"value="Submit" />
</form>

Answer 1

如果键中有hyphen，则不能使用dot (.)运算符。使用bracket notation []访问属性。

document["search-theme-form"].action = x;

Answer 2

您需要使用document.querySelector('[name="search-theme-form"]')以获得更好的方法。此外，请始终检查浏览器的console以检查错误并尝试解决。问题是您没有选择form元素，因此使用document.querySelector('[name="search-theme-form"]')将选择form元素，然后向其添加action。因此，document.search-theme-form.actionundefined在左侧，因为您需要改用document['search-theme-form'].action。

var params = (new URL(document.location)).searchParams;
var studentId = params.get("stdid");
var studentId = params.get("stdid");
var x = "app/students/"  + studentId;
document.querySelector('[name="search-theme-form"]').action = x;

<form action="/" method="POST" name="search-theme-form" id="search-theme-form" >
User <input type="text" name="user" />
Term<input type="text" name="term" />
Subject<input type="text" name="subject" />
Grade<input type="text" name="grade" />
Marks<input type="text" name="marks" />